el-checkbox-group多选框,关联选择,选择其中一个,另一个自动选中,取消选中,另一个也取消选中

需求就是如下图,选中结果对比,创建任务自动选中,取消选中结果对比时,创建任务也自动取消,并且创建任务可以单独选择。

image.png

在这里我们要用到vue的监听事件,watch。监听我们多选框绑定的Modal,并根据newVal和oldVal进行判断,

  watch: {
      upgrade_option_array(newVal, oldVal) {
        if (newVal.indexOf('结果对比') !== -1 && newVal.indexOf('创建任务') === -1) {
          newVal.push('创建任务')
          this.form.showTask = true
        }
        if(oldVal.indexOf('结果对比') !== -1 && newVal.indexOf('结果对比') === -1){
          var index = newVal.indexOf('创建任务')
          if(index > -1){
            newVal.splice(index,1)
            this.form.showTask = false
          }
        }
        if(newVal.indexOf('创建任务') !== -1){
          this.form.showTask = true
        }
  
      }
    },
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。