ElementUi 表單驗證
- 能夠在pattern中書寫正則,而且配合elementUI進行表單驗證。
- pattern 屬性規定用於驗證輸入字段的模式。模式指的是正則表達式。
rules: {
name:[{
required: true,
message: '請輸入用戶名',
trigger: 'blur'
},{
min: 2,
max: 5,
message: '長度在 2 到 5 個字符'
},{
pattern: /^[\u4E00-\u9FA5]+$/,
message: '用戶名只能爲中文'
}
//{ pattern:/^[a-zA-Z]w{1,4}$/, message: '以字母開頭,長度在2-5之間, 只能包含字符、數字和下劃線'}
],
password: [{
required: true,
message: '請輸入密碼',
trigger: 'blur'
}, {
min: 6,
max: 30,
message: '長度在 6 到 30 個字符'
}, {
pattern: /^(\w){6,20}$/,
message: '只能輸入6-20個字母、數字、下劃線'
}],
mobile:[{
required: true,
message: '請輸入手機號碼',
trigger: 'blur'
},
{validator:function(rule,value,callback){
if(/^1[34578]\d{9}$/.test(value) == false){
callback(new Error("請輸入正確的手機號"));
}else{
callback();
}
}, trigger: 'blur'}
],
// pattern: /^1[34578]\d{9}$/, message: '目前只支持中國大陸的手機號碼' }
peopleID:[{
required: true,
message: '請輸入身份證ID',
trigger: 'blur'
},{
pattern:/(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/, message: '你的身份證格式不正確'
}
],
carId:[
{required: true, message: '請輸入車牌號', trigger: 'blur'},
{pattern:/(^[\u4E00-\u9FA5]{1}[A-Z0-9]{6}$)|(^[A-Z]{2}[A-Z0-9]{2}[A-Z0-9\u4E00-\u9FA5]{1}[A-Z0-9]{4}$)|(^[\u4E00-\u9FA5]{1}[A-Z0-9]{5}[掛學警軍港澳]{1}$)|(^[A-Z]{2}[0-9]{5}$)|(^(08|38){1}[A-Z0-9]{4}[A-Z0-9掛學警軍港澳]{1}$)/,
message: '常規格式:晉B12345'},
],
},