[Vuejs]-Vee-validate button validation

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.

Leave a comment