el-radio 规则校验必填不生效

 1.vue代码

     <el-form-item label="工单状态" prop="orderStatus">
          <el-radio-group v-model="form.orderStatus">
            <el-radio  key="1"  label="状态1" ></el-radio>
             <el-radio  key="2"  label="状态2" ></el-radio>
          </el-radio-group>
        </el-form-item>

2.规则代码

发现不生效，输入与否都不提示。

 // 表单校验
      rules: {
        orderStatus:[
          { required: true, message: '请选择工单状态', trigger: 'change' }
        ],
      },

3.原因分析

el-radio默认的值是0，导致规则校验 以为已经选择过了，导致规则报错不提示

4.调整办法

手动判断

     data() {

    var validateRadio = (rule, value, callback) => {
      if (value) {
         // 当值为0的时候当做没选择
         if (value==0) {
          callback(new Error('请选择工单状态'))
        }  else {
          callback();
        }
      } else {
        callback(new Error('请选择工单状态'));
      }
    };

    return { 

 // 表单校验
      rules: {
      
        orderStatus:[
          { validator: validateRadio, trigger: 'blur' },
        ],
      },
}