AntDesign表单验证规则
1、vue 页⾯代码
<a-spin :spinning="confirmLoading">
<a-form :form="form">
<a-form-item
label="bizCode"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
has-feedback="">
<a-input placeholder="请输⼊bizCode"
v-decorator="['bizCode', {rules: [
{required: true, message: '请输⼊bizCode!'},
{ min: 3, max: 4, message: 'bizCode需在2-4位之间', trigger: 'blur' },
{required: true, message: '请填写邮箱!'},
{validator:EmailValidator}
]}]"/>
</a-form-item>
2、vue 验证规则代码
methods: {
EmailValidator(rule, value, callback){
const idcardReg = /^[A-Za-z\d]+([-_.][A-Za-z\d]+)*@([A-Za-z\d]+[-.])+[A-Za-z\d]{2,4}$/
if (!st(value)) {
/
/ eslint-disable-next-line standard/no-callback-literal
callback('邮箱格式不正确')
}
// Note: 必须总是返回⼀个 callback,否则 validateFieldsAndScroll ⽆法响应
antdesignvue 表格合计callback()
}
}
3、其他的⼀些验证规则
// ⼿机号验证
MobileNumberValidator (rule, value, callback) {
const idcardReg = /^1(3|4|5|6|7|8|9)\d{9}$/
if (!st(value)) {
// eslint-disable-next-line standard/no-callback-literal
callback('⾮法格式')
}
// Note: 必须总是返回⼀个 callback,否则 validateFieldsAndScroll ⽆法响应
callback()
},
// 邮箱验证
EmailValidator (rule, value, callback) {
const idcardReg = /^[A-Za-z\d]+([-_.][A-Za-z\d]+)*@([A-Za-z\d]+[-.])+[A-Za-z\d]{2,4}$/
if (!st(value)) {
/
/ eslint-disable-next-line standard/no-callback-literal
callback('⾮法格式')
}
// Note: 必须总是返回⼀个 callback,否则 validateFieldsAndScroll ⽆法响应
callback()
},
// ⾝份证验证
IDValidator (rule, value, callback) {
const idcardReg = /^[1-9][0-9]{5}(19|20)[0-9]{2}((01|03|05|07|08|10|12)(0[1-9]|[1-2][0-9]|31)|(04|06|09|11)(0[1-9]|[1-2][0-9]|30)|02(0[1-9]|[1-2][0 -9]))[0-9]{3}([0-9]|x|X)$/
if (!st(value)) {
// eslint-disable-next-line standard/no-callback-literal
callback('⾮法格式')
}
// Note: 必须总是返回⼀个 callback,否则 validateFieldsAndScroll ⽆法响应
callback()
}