动态表单校验

业务场景：

根据勾选的经营方式，来做下方表单必填校验，比如 勾选了集体自主经营，下方字段括号内是集体自主经营的值必须大于0，其他必填字段不够选只能为0

代码：

let thanZero = (rule, value, callback) => {
  if (!value) {
    return callback(new Error('必填'));
  }
  if (value == 0) {
    callback(new Error('已勾选经营方式不能为0'));
  } else {
    callback();
  }
};
let equalZero = (rule, value, callback) => {
  if (!value) {
    return callback(new Error('必填'));
  }
  if (value && value != 0) {
    callback(new Error('未勾选经营方式只能为0'));
  } else {
    callback();
  }
};
let r1 = { required: true, message: '必填', trigger: 'blur' }
let r2 = { validator: thanZero, required: true, trigger: 'blur' }
let r3 = { validator: equalZero, required: true, trigger: 'blur' }
export default {
    data() {
    return {
      tableData: [],
      type: '',
      title: '',
      form: this.detailForm || createSearchForm(),
      defaultRules:{
          operationMode: {rule:[{type: 'array'},r1],level:0},
          oneArea: {rule:[r1],level:0},
          twoArea: {rule:[r1],level:0},
          threeArea: {rule:[r1],level:0},
          fiveArea: {rule:[r1],level:0},
          nineArea: {rule:[r1],level:0},
          elevenArea: {rule:[r1],level:0},
          twelveArea: {rule:[r1],level:0},
      },
      ruleMap: {
        0:{
          ...this.defaultRules,
          threeArea: {rule: [r2], level:  4},
          fiveArea: {rule: [r3], level: 1},
          nineArea: {rule: [r3], level: 1},
          twelveArea: {rule: [r3], level: 1},
        },
        1:{
          ...this.defaultRules,
          threeArea: {rule: [r3], level: 1},
          fiveArea: {rule: [r2], level: 4},
          nineArea: {rule: [r3], level: 1},
          twelveArea: {rule: [r3], level: 1}
        },
        3:{
          ...this.defaultRules,
          fiveArea: {rule: [r3], level: 1},
          threeArea: {rule: [r3], level: 1},
          nineArea: {rule: [r2], level: 4},
          twelveArea: {rule: [r3], level: 1},
        },
        4:{
          ...this.defaultRules,
          fiveArea: {rule: [r3], level: 1},
          threeArea: {rule: [r3], level: 1},
          nineArea: {rule: [r3], level: 1},
          twelveArea: {rule: [r2], level: 4},
        }
      },
      phid: '',
      categoryList: [],
      modes: [
          {id: 0, label: '集体自主经营' },
          {id: 1, label: '出租经营' },
          {id: 3, label: '其他经营方式' },
          {id: 4, label: '流转入集体统一经营' }
      ],
      typeList: []
    }
  },
}，
computed: {
    // 总计项目金额  oneArea twoArea elevenArea （1）=（2）+（11）
    oneArea() {
      return Number(this.form.twoArea) + Number(this.form.elevenArea)
    },
    // （2）=（3）+（5）+（9） threeArea fiveArea nineArea
    twoArea() {
      return Number(this.form.threeArea) + Number(this.form.fiveArea) + Number(this.form.nineArea) || 0
    },

    rules(){
      let r = this.form.operationMode.reduce((rule,key) => {
        Object.entries(this.ruleMap[key]).map(([k,v])=>{
          if(rule[k].level < v.level){
            rule[k] = v
          }
        })
        return rule
      },this.defaultRules)
      let rule = Object.entries(r).reduce((map,[key,value])=>{
        map[key] = value.rule
        return map
      },{})
      return rule
    }

  },