1、定义验证提示语

let netReqType = [
  { required: true, message: '需求类型不能为空', trigger: 'change' }
];
let netIssueType = [
  { required: true, message: '问题类型不能为空', trigger: 'change' }
];

 

2、watch监听

watch: {
  "form.netType": function (val) {
      //工单类型=需求
      if (val == "1"){
        this.showNetReqType = true;
        this.showNetIssueType = false;
        Object.assign(this.rules, {
          netReqType
        });
        //点击提交按钮才触发校验
        //this.$refs.form.validateField(["netReqType"]);
        //this.$refs.form.clearValidate(["netIssueType"]); 
        // 添加验证,立即触发校验
        setTimeout(() => { 
          this.$refs.form.validateField(["netReqType"]);
          this.$refs.form.clearValidate(["netIssueType"]);
        }, 1);
      //工单类型=问题
      }else if (val=="2"){
        this.showNetReqType = false;
        this.showNetIssueType = true;
        Object.assign(this.rules, {
          netIssueType
        });
        //点击提交按钮才触发校验
        //this.$refs.form.validateField(["netIssueType"]);         //this.$refs.form.clearValidate(["netReqType"]);
        // 添加验证,立即触发校验
        setTimeout(() => { 
          this.$refs.form.validateField(["netIssueType"]);
          this.$refs.form.clearValidate(["netReqType"]);
        }, 1);
      }
  }
}

3、效果,点击工单类型给问题类型或者需求类型下拉框添加rules验证

 

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐