vue+elementUI 正则
2019-04-12 本文已影响7人
zlf_j
- 常见字段
data () {
let assetName = (rule, value, callback) => {
if (!this.checkSpecialKey(value)) {
callback(new Error('不可有特殊符号'))
} else {
callback()
}
};
let assetByname_name = (rule, value, callback) => {
let reg = /[\u4E00-\u9FA5\s]/
if (reg.test(value)) {
callback(new Error('不可出现汉字、空格'))
} else {
callback()
}
};
let assetByname_length = (rule, value, callback) => {
if (value.length > 15) {
callback(new Error('不得超过15个字符'))
} else {
callback()
}
};
return {
rules: {
asset_name: [
{ required: true, message: '请输入名称' }, // 必填项校验
{ validator: assetName, message: '不可有特殊符号' }, // 输入时,校验
{ validator: assetName, trigger: 'blur' }, // 失去焦点时,校验
{ validator: assetByname_name, message: '不可出现汉字、空格' },
{ validator: assetByname_length, message: '不得超过15个字符' },
{min: 3, max: 5, message: '长度为3-5个字符'},
{pattern: /^[0-9]+$/, message: '必须为数字'},
{pattern: /^[a-zA-Z]+$/, message: '必须为字母'},
{pattern: /^[\u4E00-\u9FA5]+$/, message: '必须为中文'},
{pattern: /^[a-zA-Z0-9]+$/, message: '必须为字母与数字'},
{pattern: /^[^0-9]/, message: '首字符不可为数字' }
]
}
}
}
- 手机号,邮箱,身份证号
data() {
let checkContactWay = (rule, value, callback) => {
// if (!value) {
// return callback(new Error('手机号码不能为空'))
// }
let myreg = /^[1][3,4,5,7,8][0-9]{9}$/
setTimeout(() => {
if (!myreg.test(value)) {
callback(new Error('请输入有效的手机号码'))
} else {
callback()
}
}, 200)
}
let checkEmail = (rule, value, callback) => {
// if (!value) {
// return callback(new Error('邮箱不能为空'))
// }
let reEmail = /^([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+\.[a-zA-Z]{2,3}$/;
if (!reEmail.test(value)) {
callback(new Error('请输入正确的邮箱格式'))
} else {
callback()
}
}
let idCard = (rule, value, callback) => {
if (value && (!(/\d{17}[\d|x]|\d{15}/).test(value) || (value.length !== 15 && value.length !== 18))) {
callback(new Error('身份证号码不符合规范'))
} else {
callback()
}
}
return {
form: {
contact_way: '', // 手机号
email: '' // 邮箱
id_number: '' // 身份证号
},
rules: {
contact_way: [
{ validator: checkContactWay, trigger: 'blur' },
{'required': 'true', 'message': '请输入公司联系方式', 'trigger': 'blur'}
],
email: [
{ validator: checkEmail, trigger: 'blur' },
{'required': 'true', 'message': '请输入公司邮箱', 'trigger': 'blur'}
],
id_number: [
{validator: idCard, message: '身份证号码不符合规范'}
],
}
}
},
elementUI表单验证,参考:http://element.eleme.io/#/zh-CN/component/form
- 正则表达式限制输入时不能输入空格
https://blog.csdn.net/iteye_11773/article/details/82677058