element-ui Form表单校验相关
1.resetFields与clearValidate方法
//根据需求二选一
this.$refs[refElement].resetFields(); //移除校验结果并重置字段值 this.$refs[refElement].clearValidate(); //移除校验结果
2.表单校验规则自定义,使用
//先定义自定义校验的校验规则 const validatePwd = (rule, value, callback) => { const originPwd = this.accountCreateForm.accountPwd; if (value === "") { callback(new Error("请再次输入密码")); } else if (value !== originPwd) { callback(new Error("两次输入密码不一致!")); } else { console.log("ok"); callback(); } }; accountCreateRules: { accountConfirmPwd: [ { required: true, message: "确认密码不能为空", trigger: "blur" }, { pattern: /^[\w_.,!`@#$%^&*()';:]{8,16}$/, message: "密码由8-16位字母、数字、常用字符组成" }, { validator: validatePwd, trigger: "blur" } //规则列表加入自定义规则 ] } <el-form ref="accountCreateForm" :rules="accountCreateRules" :model="accountCreateForm" label-width="80px" >....... //在form表单声明使用的规则 //通过$refs['']取得form元素进行规则校验结果判定 this.$refs["accountCreateForm"].validate(valid => { if (valid) {} //校验通过 });

浙公网安备 33010602011771号