Has anyone been able to successfully apply veevalidate to vuetify's v-menu component?
I've tried using the validation-provider container with other HTML inputs and it works fine, but when I try to integrate it with v-menu
, it doesn't seem to work. I haven't been able to find a solution to this problem anywhere. Has anyone else faced the same issue?
<ValidationObserver v-slot="{ handleSubmit }">
<form @submit.prevent="handleSubmit(_submit)">
<validation-provider rules="required" v-slot="{ errors }">
<v-menu width="300" max-height="400">
<template v-slot:activator="{ on, attrs }">
<b-input-group v-on="on" v-bind="attrs" class="mr-sm-2 mb-sm-0">
<b-input-group-prepend>
<span class="input-group-text" id="basic-addon1">
<i class="i-Music-Note-2 text-18"></i>
</span>
</b-input-group-prepend>
<b-form-select id="inline-form-input-username"></b-form-select>
<span class="text-red">{{errors[0]}}</span>
</b-input-group>
</template>
<template v-for="items in item_list">
<p>{{item.name}}</p>
</template>
</v-menu>
</validation-provider>
</form>
</ValidationObserver>