1.表单校验,单独进行数字校验,使用下面的代码是可以的,
{type: 'number', message: '请输入数字', trigger: 'blur'}
但同时进行数字和为空校验,使用下面的代码是不行的,输入数字的时候一直提示不能为空
{required: true, message: '电话号码不能为空', trigger: 'blur'},
{type: 'number', message: '请输入数字', trigger: 'blur'}
修改方法是:
- 设置input的类型为text
<Form-item label="收货电话" prop="deliveryMobile">
<Input type="text" v-model="form.deliveryMobile" placeholder="请输入" />
</Form-item>
- 对number的校验需要自定义,而判空可以使用系统自带的
在data中自定义一个队number的校验
const validateMobile = (rule, value, callback) => {
if (!Number.isInteger(+value)) {
callback(new Error('请输入数字值'));
} else {
callback();
}
};
然后在校验的规则处,填写:
ruleValidate: {
deliveryMobile: [
{required: true, message: '电话号码不能为空', trigger: 'blur'},
{validator: validateMobile, trigger: 'blur'}
]
}