vee-validate 在控制台中验证不存在的字段错误答案

【问题标题】：vee-validate Validating a non-existent field error in consolevee-validate 在控制台中验证不存在的字段错误
【发布时间】：2021-09-01 05:00:11
【问题描述】：

问题是当我尝试使用 VeeValidate 验证我的字段时收到此错误。

在我提交表单并且数据发送成功后显示错误。

谁能帮帮我。

vee-validate.esm.js?7bb1:305 Uncaught (in promise) Error: [vee-validate] Validating a non-existent field: "#1". Use "attach()" first.
    at createError (vee-validate.esm.js?7bb1:305)
    at Validator._handleFieldNotFound (vee-validate.esm.js?7bb1:3683)
    at Validator.validate (vee-validate.esm.js?7bb1:3262)
    at ScopedValidator.validate (vee-validate.esm.js?7bb1:2735)
    at VueComponent.fn (vee-validate.esm.js?7bb1:2381)
    at Watcher.run (vue.runtime.esm.js?2b0e:4568)
    at flushSchedulerQueue (vue.runtime.esm.js?2b0e:4310)
    at Array.eval (vue.runtime.esm.js?2b0e:1980)
    at flushCallbacks (vue.runtime.esm.js?2b0e:1906)

【问题讨论】：

您也可以添加您的代码吗？

标签： vue.js

【解决方案1】：

如果您最有可能发布您的代码，您将获得更合适的答案。同时，我刚刚处理了一个类似的问题。

在这个github issue 中，他们确定了一些可能与您的原始问题相关的问题。

如果您使用 v-if 指令，请确保在隐藏元素时不要修改链接到验证器的值（在动态呈现时更改绑定到验证器的值）。
如果您动态渲染输入组件，请确保在渲染所需组件后附加验证器。

在这两种情况下，您的解决方案都与 $nextTick 有关：

makeChange() {
let result = await this.$validator.validateAll()
        this.renderCondition = false
        this.$nextTick(() => {
          this.inputValue = undefined
        })
}
// vue component looks like
<input v-if="renderCondition" v-model="inputValue" @submit='makeChange' />

【讨论】：