vue表单rules校验是动态的

表单代码如下：

 <el-form ref="form" label-width="60px" :model="formData" :rules="newRules">
      <el-form-item label="分类类型" prop="type">
        <el-select
          v-model="formData.type"
          :data="typeList"
        />
      </el-form-item>
      <el-form-item label="预算科目" prop="subjectTree">
        <el-select
          v-model="formData.subjectTree"
          :data="valueList"
        />
      </el-form-item>
      <el-form-item label="资金管理方式" prop="value">
        <el-select
          v-model="formData.value"
          :data="valueList"
        />
      </el-form-item>
    </el-form>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

rules代码：
本来是把rules写在data里的 发现校验并未生效 后来只能放在computed里

 computed: {
    newRules() {
      const { formData } = this
      return {
        type: [
          {
            required: true,
            message: this.$t('validator.required', { name: '分类类型' })
          }
        ],
        subjectTree: [
          {
            required: formData.type === '0' ? true : false,
            message: this.$t('validator.required', { name: '预算科目' })
          }
        ],
        value: [
          {
            required: formData.type === '1' ? true : false,
            message: this.$t('validator.required', { name: '资金管理方式' })
          }
        ]
      }
    }
  },
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25