vue表单验证，中文验证

大家好，欢迎来到IT知识分享网。

el-input

:rules=“rules” 验证必需要加

<el-form ref="loginForm" :model="loginForm" :rules="rules" class="login-form" auto-complete="on" >
   <el-form-item prop="account">
     <span class="font-container">
       <i class="iconfont icon-yonghu"></i>
     </span>
     <el-input name="account" placeholder="账号" type="text" />
   </el-form-item>
   <el-form-item label="手机号码" prop="phone">
     <el-input maxlength="11" placeholder="手机号" name="phone" type="text" ></el-input>
    </el-form-item>
   </el-form>

data

 data(){ 
   
 	return { 
   
 		 rules: { 
   
		    account: [
		       { 
   //第一种验证方式
		         trigger: "blur",
		         validator: (rule, value, callback) => { 
   
		           //中文验证
		           var reg = /[^\u4e00-\u9fa5]/;
		           if (value === "") { 
   
		             callback(new Error("请输入账号"));
		           } else if (!reg.test(value)) { 
   
		             callback(new Error("账号不能为中文"));
		           } else { 
   
		             callback();
		           }
		         }
		       }
		    ],
			phone: [
		      { 
   //第二种验证方式
		        required: true,
		         message: "请填写当前用户的手机号码！",
		         trigger: "blur"
		       },
		       { 
   
		         pattern: /^(1[2-9][0-9])\d{8}$/,
		         message: "手机号码格式不正确！",
		         trigger: "blur"
		       }
		     ],
		  }	
 	}
 }

常用正则表达式 https://blog.csdn.net/weixin_45161039/article/details/107966869