1,实现 手机号校验
在data 中定义一个校验手机号的方法
let validatorPhone=(rule,value,callback)=>{// 如果为空值,就抛出错误if(!value){callback();}else{// 正则判断手机号格式的格式,正则判断失败抛出错误,否则直接callback()if(!/^1[2-9]\d{9}$/.test(value)){callback(new Error("手机号格式不正确!"));}else{callback();}}}// 在rules中直接引用rules:{phone:[{validator:validatorPhone,trigger:"change"}],}
2,校验身份证号码
第一种:同上在data中定义一个校验身份证的方法
let validatorIdcord=(rule,value,callback)=>{// 如果为空值,就抛出错误if(!value){callback();}else{// 正则判断手机号格式的格式,正则判断失败抛出错误,否则直接callback()if(!/(^\d{18}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/.test(value)){callback(new Error("身份证格式不正确!"));}else{callback();}}}// 在rules中直接引用rules:{idCard:[{validator:validatorIdcord,trigger:"change"}]}
第二种:直接在rules 中定义
examIdCard:[{required: true, message: '请输入体检人身份证号', trigger: 'blur' },{pattern: '^\\d{6}(18|19|20)?\\d{2}(0[1-9]|1[012])(0[1-9]|[12]\\d|3[01])\\d{3}(\\d|[xX])$',message: '身份证号格式不正确'}],
3,校验中文以及中文符号
同上在data中定义一个校验中文和中文符号的方法
let checkData =(rule, value, callback)=>{if (value) {if (/[^\x00-\xff]/g.test(value)) {callback(new Error('不能输入汉字或中文符号!'));} else {callback();}}callback();}// 直接在rules 中使用rules:{workingTime:[{required:true,message:'请输入工作时间',trigger:'blur' },{validator:checkData,trigger:"change"}],}
4,校验邮箱
<html lang="zh-CN"><head><meta charset="UTF-8"><title>Document</title></head><body><input type="text" placeholder="请输入邮箱" id="email"></body><script>email.onchange = function(){var email = this.value;var reg = /^([a-zA-Z]|[0-9])(\w|\-)+@[a-zA-Z0-9]+\.([a-zA-Z]{2,4})$/;if(reg.test(email)){alert("邮箱格式正确");}else{alert("邮箱格式不正确");}}</script></html>`