vue el-form自定义验证validator,以限制数字类型为例
rules: {type: [{ required: true, message: "类型不能为空", trigger: "change" }],age: [{ required: true, msg: "年龄不能为空", trigger: "blur" , validator:limitNumber}],count: [{ required...
·
rules: {
type: [
{ required: true, message: "类型不能为空", trigger: "change" }
],
age: [
{ required: true, msg: "年龄不能为空", trigger: "blur" , validator:limitNumber}
],
count: [
{ required: true, msg: "数目不能为空", trigger: "blur" , validator:limitNumber}
],
price: [
{ required: true, msg: "服务费不能为空" isInteger:true, trigger: "blur" , validator:limitNumber}
],
}
export default {
data() {
let limitNumber = (rule, value, callback) => {
if (!value&&!(value?.trim())) {
return callback(new Error(rule.msg))
} else if(isNaN(value)){
callback(new Error('只允许输入数字'))
//如果某个字段要求整数+数字
} else if (rule.isInteger && !Number.isInteger(+value)) {
callback(new Error('只允许输入整数'))
} else if (value.trim() < 0) {
callback(new Error('数字应大于等于0'))
} else {
callback()
}
}
return {
loading: true,
total: 0,
限制电话号码(如果某些字段不是必填,但是填了就要校验)
let phoneNumberValid = (rule, value, callback) => {
if (value) {
if (!Number.isInteger(+value)) {
callback(new Error('必须全为数字'))
} else if (value.trim().length < 8 || value.trim().length > 12) {
callback(new Error('数字长度必须在8到12之间'))
} else {
callback()
}
} else if (rule.required) {
// 如果没值又是必填
callback(new Error(rule.msg))
} else {
callback()
}
}
phoneNumber: [
{ required: false, msg: "联系电话不能为空", trigger: "blur", validator: phoneNumberValid }
],
cNumber: [
{ required: true, msg: "用户联系电话不能为空", trigger: "blur", validator: phoneNumberValid }
],
更多推荐
已为社区贡献39条内容
所有评论(0)