vue表单验证自定义验证规则详解
这篇文章主要为大家详细介绍了vue表单验证自定义验证规则,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
本文实例为大家分享了vue表单验证自定义验证规则,供大家参考,具体内容如下
这是公司里Vue+Element UI的项目。写的验证规则放图:

样式代码:
情况反馈表
提交
js代码:
data(){ return{ rules:{ way:[ { required: true, message: '请输入听取意见方式', trigger: 'change' } ], attitude:[ { required: true, message: '请输入人员态度', trigger: 'change' } ] } } }记住form表单一定要“:rules=“rules(自己定义)””,下面是自定义规则,放图:

样式代码:
{{username}} 提交
js代码:
data(){ //这里是自定义的规则 var newpwdmin=(rule, value, callback)=>{ if(!value){ return callback(new Error('请输入密码')); }else if(value !==this.Formname.newpwd){ return callback(new Error('两次输入密码不一致!')); }else { callback() } } return{ editFormPwd:{ oldpwd:[{ required: true, message: '请输入原密码', trigger: 'blur'}], newpwd:[{ required: true, message: '请输入密码', trigger: 'blur' },], newpwds:[{ required: true,validator: newpwdmin, trigger: 'blur'}], } } }提交返回什么就不写了;
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持0133技术站。
标签: