Vee验证返回true，但应返回false

Question

我正在使用Vuetify，并且拥有一个表单，其中我正在使用VeeValidate进行表单验证... 当我使用此：

.txt

即使我输入字段上的验证无效，它也始终返回true。 输入看起来像：

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

输入组件的代码：

<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>

}

我在另一个组件中调用this。$ validator.validateAll（）...输入组件是一个独立的组件...我将它们全部包裹在一个form标记中，并在Submit上运行validate函数

Answer 1

您有两种选择：

1. 将$attrs

中的v-validate传递给组件

2. 将$ validator注入组件

父母

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

孩子

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

您还可以简化html代码，请参见VeeValidate Syntax

HTML

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

您可以安全地删除

:required="isRequired"