下划线英文

在vue+element-ui框架input中添加英⽂数字中⽂下划线正则约束

（1）⼀般的约束添加：找到你要约束的输⼊input框，⽐如下列代码：

onkeyup="=e(/[^w_^u4E00-u9FA5]/g,'');"

maxlength="8"

v-model=""

placeholder="请输⼊联系⼈姓名">

在input标签中加⼊οnkeyup="=e(/[u4E00-u9FA5]/g,’’);"是约束语句，这⾥的正则表达式是只能输

⼊中⽂、⼤⼩写字母、数字、下划线。maxlength=“8”，表⽰所有字符加起来不能超过8个。

//⼩数约束123.2222222222

@input="=e(/[^d.d$]/g,'')"

//长度约束

maxlength="6"

//数字约束

onkeyup="=e(/[^d.]/g,'');"maxlength="6"

//中⽂英⽂数字下划线

onkeyup="=e(/[^w_^u4E00-u9FA5]/g,'');"maxlength="6"

（2）固定电话及⼿机号约束添加：

第⼀步：找到input标签在其中加⼊如下代码：

onkeyup="=e(/[^d]/g,'');"

maxlength="11"

v-model=""placeholder="请输⼊企业电话号码">

第⼆步：然后在return中添加relus规则约束：

return{

rules:{

phone:[{required:true,validator:checkTel,trigger:'blur'}],

},

}

第三步：在return{}同⼀级也就是data(){}中添加checkTel校验⽅法：（特别注意不要加在methods:{}和mounted(){}这个⼏个⽅法

中）：

constcheckTel=(rule,value,callback)=>{

if(!value||!()){

returncallback(newError('请输⼊联系⼈电话'))

}

letlandlinePtn=/^(0[0-9]{2,3}-)([2-9][0-9]{6,7})+(-[0-9]{1,4})?$/

letmobilePtn=/^1[3|4|5|6|7|8|9][0-9]{9}$/

tTimeout(()=>{

if(!(value)&&!(value)){

callback(newError('固话或⼿机号格式错误'))

}el{

callback()

}

},1000)

}

第四步：在input标签外包裹⼀层el-form-item标签并且添加约束规则prop=“phone”(注意这prop⾥⾯的phone要与rules和v-model⾥

⾯命名⼀致)，最后标签显⽰如下即可：

w_

onkeyup="=e(/[^d]/g,'');"

maxlength="11"

v-model=""placeholder="请输⼊企业电话号码">

第五步：在el-form标签中加⼊:rules="rules"最终效果如下：

.

.

.

onkeyup="=e(/[^d]/g,'');"

maxlength="11"

v-model=""placeholder="请输⼊企业电话号码">

.

.

.