验证在页面加载时多次触发

时间:2019-01-30 15:29:02

标签: javascript validation vue.js vuejs2 vuelidate

我使用的是Vue,用于验证的是Vuelidate

使用执行AJAX调用的自定义验证程序时,它会在页面加载时甚至在用户互动之前(Vuelidate的$touch)触发多次

在首次加载这些多次调用之后,验证可以正常工作。 (我使用vue @change对输入更改使用此验证)

我尝试设置标志isMounted,以便仅在加载整个实例后在de custom validateator中执行验证,但是没有成功。

代码

验证器(仅用于调试,用于测试):

validations() {
    return {
        myFieldToValidate(field) {
            test_validation(value) {
                console.log('test validation fired!', Math.random());
                return true;
            }
        }
    }
}

然后,当我重新加载页面时,它会触发多次:

multiple-calls

我只想根据事件(输入更改)而不是页面加载多次来使验证“触发”。如何实现呢?

2 个答案:

答案 0 :(得分:0)

@change.once应该可以解决问题

有关更多信息,请参见链接 https://vuejs.org/v2/api/#vm-once

答案 1 :(得分:0)

我结束了制作自己的函数以进行ajax调用,与vuelidate分开了。我用lodash' _.debounce控制通话。

我将函数绑定到@input事件,基于该事件进行ajax调用,并返回带有结果的“ flag”属性。

然后,我使用此标志检查字段的有效性。

使用此异常,该事件不会在页面加载时多次触发。