Vue-日常开发/自定义验证form 表单(三)--持续更新-

118 阅读1分钟

在el-tabel 表格里面用到v-if 来控制按钮状态---2个状态控制时 需要加()来区别下

微信截图_20220805151901.png

 v-if="scope.row.state>5 &&scope.row.state<=9 && (scope.row.insuranceStatus==1 
||scope.row.insuranceStatus==2 
||scope.row.insuranceStatus==4 
||scope.row.insuranceStatus==5)"

在el-form 表单验证中遇到 审核通过/不通过 (不通过时需要验证备注必须填写)

审核通过不校验

2.png

审核不通过校验

3.png

<el-form :model="formData" :rules="auditForm" ref="auditForm">
          审核结果
          <el-form-item prop="auditStats">
            <el-radio-group v-model="formData.auditStats">
              <el-radio :label="1">审核通过</el-radio>
              <el-radio :label="2">审核不通过</el-radio>
            </el-radio-group>
          </el-form-item>

          <el-form-item prop="textArea" label="备注:">
            <p style="color: #ccc">审核不通过时必须录入</p>
            <el-input
              type="textarea"
              :rows="2"
              placeholder="请输入不少于5个字的备注"
              v-model="formData.textArea"
            >
            </el-input>
          </el-form-item>
        </el-form>
 computed: {
    auditForm() {
      return {
        textArea: [
          {
            required: this.formData.auditStats == 2 ? true : false,
            message: "备注不能为空",
            trigger: "change",
          },
        ],
      };
    },
  },