Vuelidate проверяет на странице render

Vuelidate проверяет на странице render

17.01.2020 10:15:25 Просмотров 29 Источник

В нашем приложении Vue мы используем Vuelidate для проверки формы. Существует такое поведение, когда поля проверяются точно так же, как и страница, когда она должна быть проверена только при отправке формы, как указано в документах, использующих $v. invalid и $v. touch() при обработке отправки. Странно то, что на некоторых страницах, где он реализован, он работает хорошо. Но иногда, на других страницах, он будет подтверждать таким образом, что я не хочу, но я не вижу, где я могу обойти это. Кто-нибудь проходил через это? Некоторые фрагменты кода.

 <input
      id="name"
      type="text"
      name="name"
      v-model="form.name"
      :class="{
        invalid:
        !$v.form.name.required || !$v.form.name.minLength,
       }"
 />

Мой объект данных и проверки

data: {
      form: {
      name: '',
      birth: '',
      parentage: '',
    }
 },
 validations: {
   form: {
      name: { required, minLength: minLength(4) },
 }

Способ подачи документов

async submit() {
  this.$v.touch();
  if (!this.$v.$invalid) {
    console.log('Submit');
  }
}
У вопроса есть решение - Посмотреть?

Ответы - Vuelidate проверяет на странице render / Vuelidate validates on page render

Является ответом!
Pranav Kale

28.01.2020 03:50:47

По мере отображения страницы vuelidate будет выполнять все проверки формы. Вот как работает Вуэльта.

Вам нужно проверить форму на наличие грязи, а также на то, что она недействительна.

$v.$dirty() && $v.$invalid()

Когда вы используете $v.$touch() или $v.$reset(), vuelidate знаки виде, как грязные.

Пожалуйста, прочтите https://vuelidate.js.org/#sub-v-values чтобы понять важность этих методов.

Закрыть X