1.在组件的data里 声明验证规则:
const validatePhone = (rule, value, callback) => {
if (!value) {
return callback(new Error('手机号不能为空'));
} else if (!/^1[34578]\d{9}$/.test(value)) {
callback('手机号格式不正确');
} else {
callback();
}
};
//注意:在return外面
2.在表单验证规则里使用
ruleValidate: {
account: [
{ required: true, message: '登录账户不能为空', trigger: 'blur' }
],
mobile: [
{ required: true,validator:validatePhone,trigger:'blur'}
],
name: [
{ required: true, message: '用户昵称不能为空', trigger: 'blur' }
]
},
注意:表单添加校验时,需要给 Form 设置属性 rules,即 “:rules="ruleValidate"”,
同时给需要验证的 FormItem 设置属性 prop 指向对应字段,即 “:prop="mobile”。