element表单动态添加或取消校验规则

最新推荐文章于 2024-03-21 20:00:38 发布

cecoal

最新推荐文章于 2024-03-21 20:00:38 发布

阅读量2.2k

点赞数 3

文章标签： vue.js 前端 javascript

本文链接：https://blog.csdn.net/cecoal/article/details/125207009

版权

element表单动态添加或取消校验规则

rules: {
//正常的校验规则是这么写的
        yjLevel: [
          { required: true, message: "请选择预警级别", trigger: "change" }
        ],
//下面这两是我要动态添加的校验规则的form表单属性，刚开始给空数组，虽然是空数组但必须要有
        startTime: [],
        relieveTime: [],
      },
//这两个对象是上面两个数据对应的校验规则，单独拧出来，不要放在rules中
      startTimerules: {
        required: true,
        message: "请选择启动时间",
        trigger: "change"
      },
      relieveTimerules: {
        required: true,
        message: "请选择解除时间",
        trigger: "change"
      },

//调用该方法就行
changtype(val) {
      //动态添加校验
      if (val == "relieve") {
        this.$set(this.rules.startTime, 0, "");
        this.$set(this.rules.relieveTime, 0, this.relieveTimerules);
      } else {
        this.$set(this.rules.relieveTime, 0, "");
        this.$set(this.rules.startTime, 0, this.startTimerules);
      }
},