el-input输入框只能输入中文，英文，邮箱，手机号
1.设置限制只能输入中文
校验中文的正则：/^[\u4e00-\u9fa5]+$/
rules: {
chineseName: [
{ required: true, message: "请输入中文名", trigger: "blur" },
{
validator: function(rule, value, callback) {
if (/^[\u4e00-\u9fa5]+$/.test(value) == false) {
callback(new Error("请输入中文"));
} else {
//校验通过
callback();
}
},
trigger: "blur"
}
],
}
2.设置限制只能输入英文字母 不区分大小写
校验英文的正则：/[a-zA-z]$/
rules: {
name: [
{ required: true, message: "请输入英文名", trigger: "blur" },
{
validator: function(rule, value, callback) {
if (/[a-zA-z]$/.test(value) == false) {
callback(new Error("请输入英文"));
} else {
//校验通过
callback();
}
},
trigger: "blur"
}
],
}
3.设置限制只能输入邮箱校验邮箱的正则：/^([a-zA-Z0-9]+[||.]?)[a-zA-Z0-9]+@([a-zA-Z0-9]+[||.]?)[a-zA-Z0-9]+.[a-zA-Z]{2,3}$/
rules: {
email: [
{ required: true, message: "请输入邮箱", trigger: "blur" },
{
validator: function(rule, value, callback) {
if (/^([a-zA-Z0-9]+[_|_|.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|_|.]?)*[a-zA-Z0-9]+\.[a-zA-Z]{2,3}$/.test(value) == false) {
callback(new Error("请输入邮箱"));
} else {
//校验通过
callback();
}
},
trigger: "blur"
}
],
}
4.设置限制只能输入手机号
校验手机号的正则：/^(13[0-9]|14[0-9]|15[0-9]|16[6]|18[0-9]|19[6,9]|17[0-9])\d{8}$/i
rules: {
phone: [
{ required: true, message: "请输入手机号", trigger: "blur" },
{
validator: function(rule, value, callback) {
if (/^(13[0-9]|14[0-9]|15[0-9]|16[6]|18[0-9]|19[6,9]|17[0-9])\d{8}$/i.test(value) == false) {
callback(new Error("请输入手机号"));
} else {
//校验通过
callback();
}
},
trigger: "blur"
}
],
}
5. 设置数字，保留两位小数
<el-input size="small"
onkeyup="this.value=this.value.match(/\d+\.?\d{0,2}/)"
onafterpaste="this.value=this.value.match(/\d+\.?\d{0,2}/)"
v-model="scope.row.abc"
maxlength="9">
</el-input>
6. 设置只允许大写字母和数字
正则：/^[0-9A-Z]+$/
rules: {
card: [
{ required: true, message: "请输入批次号", trigger: "blur" },
{
validator: function (rule: any, value: any, callback: any) {
if (/^[0-9A-Z]+$/.test(value) === false) {
callback(new Error("仅限大写字母和数字"));
} else {
//校验通过
callback();
}
},
trigger: "blur"
}
],
}
7.只允许输入数字，最小值为1
<el-input style="width: 100%" onkeyup="value=value.replace(/[^\d]/g,'');if(value<=0)value=null" v-model="ruleFiltersDto.rangeMinimum" :disabled="props.isView" placeholder="1"/>标签：el,输入框,zA,value,callback,trigger,blur,input,输入 From： https://www.cnblogs.com/dianzan/p/18671049