Ви валидировать возвращают истину, но должны вернуть ложь

Question

Я использую Vuetify, и у меня есть форма, где я использую VeeValidate для проверки формы ... Когда я использую это:

this.$validator.validateAll().then((result) => {
            console.log("result form", result);
            //result ? this.onSubmit() : scrollTo(0, 250);
        });

Всегда возвращает true, даже если проверка в моем поле ввода не является 't valid ... Вход выглядит так:

<v-textarea
    filled
    name="string"
    :label="placeholderText"
    auto-grow
    single-line
    :placeholder="placeholderText"
    v-model="answer"
    :required="isRequired"
    v-validate:computedProp="checkRequired"
    :error-messages="errors.collect('string')"
    data-vv-name="string"
    :hint="hintText"
    @blur="updateAnswer"
></v-textarea>

Код для компонента ввода:

export default {
$_veeValidate: {
    validator: 'new'
},
name: 'String',
props: {
    placeholderText: {
        default: 'Add a value'
    },
    hintText: {
        default: 'Add a value'
    },
    isRequired: {
        default: true
    }
},
data: () => ({
    answer: ''
}),
computed: {
    checkRequired() {
        return this.isRequired ? 'required' : ''
    }
},
methods: {
    updateAnswer() {
        this.$validator.validateAll();
        this.$emit('updateAnswer', this.answer);
    }
}

}

Я вызываю это. $ validator.validateAll() в другом компоненте ... Компонент ввода является автономным компонентом ... У меня есть все обертка в теге формы и запуск функции validate для отправки

Answer 1

У вас есть два варианта:

1. Передать компоненту v-validate из $ attrs

2. Вставьте $ validator в компонент

Родительский

export default {
  name: "App",
  components: {
    YourComponent
  },
  provide() {
    return {
      $validator: this.$validator
    };
  },

Дочерний

 $_veeValidate: {
    validator: "new"
  },
  inject: ["$validator"],
  name: "String",

Вы также можете упростить свой HTML-код, см. Синтаксис VeeValidate

HTML

v-validate="{ required: this.isRequired }"

И вы можете безопасно удалить

:required="isRequired"