下图为用户密码校验表单,需要对密码是否为空,密码长度,以及密码强度进行校验。
但是 “密码格式不正确!”这个校验信息并不是我想要的,我想在isPassWordStrength方法中区分开密码长度提示和密码强度提示,方便用户知道具体是什么问题导致校验不通过。
<van-field required v-model="formCustom.loginPwd" :type="passwordType" :rules="[ { required: true, message: '请输入登录密码!'}, { validator: isPassWordStrength, message: '密码格式不正确!'} ]" label="登录密码" > </van-field>
解决方法:isPassWordStrength方法第一个参数为用户输入的值,第二个参数为校验规则,可自行打印看下,就不展示了。当我们在方法中通过逻辑判断,知道密码存在的问题后,手动修改rule中的message属性为自己想要的字符串,然后return false;,
报错信息即可在表单校验中展现。如果密码没问题,return true;就可以。
isPassWordStrength: (value, rule) => { //value: 用户在文本框中输入的内容if(密码长度不够){ rule.message = '密码长度应不小于12位!' return false; } else if(密码强度不够){ rule.message = '密码必须包含数字、大写或小写字母和特殊字符四种中的三种!' return false; } else { //校验通过 return true; } },
//rule: 表单校验规则,其中需要用到的就是里面的 message属性
标签:return,vant,校验,rule,密码,文本框,false,message From: https://www.cnblogs.com/hllzww/p/17880159.html