自定义的校验:
<a-form-item label="服务标识" :required="true">
<a-input placeholder="请输入服务标识,只能使用字母、数字、下划线,例如:testPro"
:disabled="this.actionType === 'edit' || this.actionType === 'view'" v-decorator="[
'serviceName',
{rules: [{ required: true, validator: validateServiceName }]}
]" />
</a-form-item>
校验的规则:
validateServiceName(rule, value, callback) {
if (typeof value === 'undefined') {
callback(new Error('服务标识不能为空'))
}
if (value === '') {
callback(new Error('服务标识不能为空'))
} else {
const reg = /^[A-Za-z0-9_-]{1,32}$/
if (!reg.test(value)) {
callback(new Error('服务标识只能使用字母、数字、下划线和横线连接符,不能超过32字符'))
} else {
callback()
}
}
},
v-decorator="[ 'serviceName', {rules: [{ required: true, validator: validateServiceName }]} ]"
此处serviceName表示的是 校验的 名称,
required :true 表示 是否必填,如不设置,则会根据校验规则自动生成 ,
validator: validateServiceName 表示校验的规则
简单的校验:
<a-form-item label="Note">
<a-input
v-decorator="['note', { rules: [{ required: true, message: 'Please input your note!' }] }]"
/>
</a-form-item>