vue.js表单验证插件(vee-validate)的使用教程详解

2020-06-13 10:35:09易采站长站整理

// 省略
});

代码解析

VeeValidate(浏览器引入js后建立了一个全局对象)

dict 翻译的内容,其中attributes对象表示字段,messages对象表示提示信息

本地化进一步参考

常用方法

出错渲染

字段验证不通过时渲染提示信息时使用


errors.first(‘field') 显示字段field的第一个出错信息
errors.collect(‘field') 显示字段field的所有出错信息
errors.has(‘field') 判断fileds字段是否检验有误
erros.all() 显示所有的出错信息
errors.any() 判断是否有错误

手动检验

常用于数据提交(写在vue的方法内部)


this.$validator.validate(‘field'); 校验单个字段
this.$validator.validateAll(); 表单整体校验

代码片段


this.$validator.validateAll().then(function(result) {
if (result) {
//成功操作
} else {
// 失败操作
}
})

检验信息清除

常用于校验成功后清除错误的提示信息

this.errors.clear();

API进一步学习

总结

以上所述是小编给大家介绍的vue.js表单验证插件(vee-validate)的使用教程详解,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对软件开发网网站的支持!