element ui 自定义表单验证

element ui 表单验证

<el-form :model="ruleForm" :rules="rules" ref="ruleForm"  class="demo-ruleForm">
		<el-form-item prop="name">
			<span>中文姓名</span>
			<el-input placeholder="请输入真实姓名" v-model="ruleForm.name"></el-input>
		 </el-form-item>
		<el-button @click="submitForm('ruleForm')">保存</el-button>
</el-form>

export default {
		data() {
			//姓名   /^[\u4E00-\u9FA5\uf900-\ufa2d·s]{2,20}$/
			 var checname = (rule, value, callback) => {
			         if (!value) {
			           return callback(new Error('姓名不能为空'));
			         }else if(!(/^[\u4E00-\u9FA5\uf900-\ufa2d·s]{2,20}$/.test(value))){
					    return callback(new Error('姓名格式不正确'));
					 }else {
						callback();
						}     
			  };
			return {
				ruleForm: {
					id: '',
					profile: '',
					name: '',
					sex: '',
					phone: '',
					email: '',
					nationality: '',
					birth: ''
				},
				rules:{
					name:[{validator:checname,trigger:'blur'}],
				},
		},

正则验证：

姓名：

/^[\u4E00-\u9FA5\uf900-\ufa2d·s]{2,20}$/

手机号：

/^1[34578]\d{9}$/

邮箱：

/^([a-zA-Z]|[0-9])(\w|\-)+@[a-zA-Z0-9]+\.([a-zA-Z]{2,4})$/

身份证号

/(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/

护照号

/^((1[45]\d{7})|(G\d{8})|(P\d{7})|(S\d{7,8}))?$/

密码：
数字+字母

^[0-9A-Za-z]{6,24}$