我正在使用Vue,并进行验证,Vuelidate。
当使用执行AJAX调用的自定义验证器时,它会在页面加载时多次触发,甚至在用户交互之前(vuelidate的$touch
)。
在第一次加载后进行多次调用后,验证工作正常。 (我在输入更改时使用此验证,使用vue @change
)
我尝试设置一个标志isMounted
只在整个实例加载后才在自定义验证器内执行验证,但没有成功。
码
验证器(仅用于调试,用于测试):
validations() {
return {
myFieldToValidate(field) {
test_validation(value) {
console.log('test validation fired!', Math.random());
return true;
}
}
}
}
然后,当我重新加载页面时,它会多次触发:
我想仅根据我的事件(输入更改)进行验证“激活”,而不是基于页面加载多次。怎么做到这一点?
@change.once
应该做的伎俩
有关更多信息,请参阅链接https://vuejs.org/v2/api/#vm-once
我结束了自己的函数,使得ajax调用,与vuelidate
分离。我使用lodash' _.debounce来控制通话。
我将函数绑定到@input
事件,根据它调用ajax
并返回结果的“flag”属性。
然后,我使用此标志来检查字段的有效性。
使用此abordage,事件在页面加载时不会多次触发。