Vuelidate - логика проверки ошибок - PullRequest
Новая
       16

Vuelidate - логика проверки ошибок

0 голосов
/ 07 июня 2018

На официальном примере проверки формы vuetify (с использованием vuelidate) 

<v-text-field
  v-model="name"
  :error-messages="nameErrors"
  :counter="10"
  label="Name"
  required
  @input="$v.name.$touch()"
  @blur="$v.name.$touch()"
></v-text-field>

nameErrors является вычисляемым методом, который возвращает все ошибки для поля. 

  nameErrors () {
    const errors = []
    if (!this.$v.name.$dirty) return errors
    !this.$v.name.maxLength && errors.push('Name must be at most 10 characters long')
    !this.$v.name.required && errors.push('Name is required.')
    return errors
  },

Может кто-нибудь объяснить мне, в чем заключается точка линии 

if (!this.$v.name.$dirty) return errors

Зачем возвращать массив ошибок, если поле не было изменено (не грязно)?

1 Ответ

0 голосов
/ 07 июня 2018

Если вы посмотрите на документацию для v-text-field, значение пропа по умолчанию error-messages равно пустому массиву [].

https://vuetifyjs.com/en/components/text-fields

Даже если вход не был затронут и не является $ грязным, возвращаемое по умолчанию значение для этой функции всегда должно возвращать пустой массив, или я уверен, что компонент Vuetify будетвыбросить ошибку.

...