element 表单验证

Question

有个需求，点击选项，切换备注是否为必填,默认进来是非必填的，切换到必填后，验证就失效了

<el-form-item label="审核" prop="resource">
    <el-radio-group v-model="ruleForm.resource">
      <el-radio label="1">不通过</el-radio>
      <el-radio label="2">通过</el-radio>
    </el-radio-group>
  </el-form-item>
  <el-form-item label="原因" prop="beizhu" v-if="ruleForm.resource==1">
    <el-input type="textarea" v-model="ruleForm.beizhu"></el-input>
  </el-form-item>
  <el-form-item label="备注" v-if="ruleForm.resource==2">
    <el-input type="textarea" v-model="ruleForm.beizhu"></el-input>
  </el-form-item>
  <el-form-item>

Answer 1

自定义校验规则

function valid(rule, value, callback) {
    if (!requiredRemark) {
        // 备注为非必填
        callback();

    } else if (value === '') {
        // 备注必填且为空
        callback(new Error('请输入备注'));

    } else {
        // 备注必填且通过
        callback();
    }
};