vue代码
<el-form-item prop='auditStatus'>
<el-radio-group v-model="form.auditStatus">
<el-radio label="1">审核通过</el-radio>
<el-radio label="2">审核不通过</el-radio>
</el-radio-group>
</el-form-item>
不生效校验代码
auditStatus: [{
required: true,
message: '请选择审核状态',
trigger: ['blur', 'change']
}],
分析原因
el-radio默认的值是0,导致校验规则以为已经是选择过了,所以当没有选择的时候也不会报错
解决办法:手动校验
data() {
var validateRadio = (rule, value, callback) => {
if (value) {
// 当值为0的时候当做没选择
if (value == 0) {
callback(new Error('请选择审核状态'))
} else {
callback();
}
} else {
callback(new Error('请选择审核状态'));
}
};
return{}
}
//表单校验
auditStatus: [{
validator: validateRadio,
trigger: 'change'
}],
表单校验的几个注意的点
1.ref和model的值要保持一致
2. prop和v-model的名字要保持一致