Использование vee-validate для проверки dropbox

Question

Извините за самый основной вопрос

Я пытаюсь проверить форму, используя vee-validate. Текстовые / электронные / числовые поля не являются проблемой. Но я не смог найти хорошую документацию для проверки полей dropdown/checkbox/radio.

Что я хочу, это "вы должны выбрать какую-то опцию из выпадающего списка". Для этого я пытался

<p class="help is-danger" v-show="standard===''">Select the standard student is studing in.</p>

где стандарт - это свойство, которое связывается с помощью v-model = "standard". Это работает, как задумано, но я хочу, чтобы это сообщение отображалось, когда выпадающий список "тронут". Я не могу понять это.

Answer 1

Я нашел обходной путь для этого,

<div class="select" :class="{'is-success': standard!='', 'is-danger': standard=='' && standardIsFocused}">
   <select v-model="standard" @focus.once="standardToggle()">
      ...
   </select>
 </div>
 <p class="help has-text-left is-danger" v-show="standard==='' && standardIsFocused">Selecting one of the option is required.</p>

в тегах скрипта

data () {
  return {
    standardIsFocused: false,
  },
methods: {
  standardToggle() {
    this.standardIsFocused = !this.standardIsFocused
  }
}

Answer 2

Вы можете использовать data-vv-validate-on атрибут:

data-vv-validate-on="focus"

Затем всякий раз, когда открывается раскрывающийся список, запускается, например, валидатор.