0👍
Your button needs to support and have v-model
directive applied to it, the validation-provider
from vee-validate tries to find the nodes/tags with v-model
and watches them for changes/updates.
So you need to create a wrapping component around v-btn
that implements v-model
support.
Eventually it should look like this:
<v-col cols="6" v-for="(opt, index) in options" :key="index">
<ValidationProvider :name="`btn_${index}`" >
<CustomButtonInput v-model="selectedOption">
{{ opt.name }}
</CustomButtonInput>
</ValidationProvider>
</v-col>
In a way it would be similar to either creating a radio
or checkbox
input components depending if you allow multiple selections or not.
- [Vuejs]-How to use php variable in Vue.js template literal?
- [Vuejs]-Use v-for in Templates (Vue-Tables-2)
Source:stackexchange.com