Использование 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"

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