zoukankan      html  css  js  c++  java
  • el-select多选时选项互斥

    应用情况:当多选框中出现  选择无则不能选择其他几项,选择了某一项或者多项别的就不能选择无

       <el-select
                    v-model="baseInfo.chengYing"
                    size="small"
                    filterable
                    placeholder="请选择具体成瘾类别"
                    clearable
                    multiple
                  >
                    <el-option
                      v-for="item in cylbList"
                      :key="item.data_code"
                      :label="item.data_name"
                      :value="item.data_code"
                      :disabled="
                        (baseInfo.chengYing.indexOf('01') > -1 &&
                          item.data_code != '01') ||
                        (baseInfo.chengYing.indexOf('01') <= -1 &&
                          baseInfo.chengYing.length > 0 &&
                          item.data_code === '01')
                      "
                    ></el-option>
                  </el-select>

    重要代码为el-option中的disabled逻辑判断
    分为两步

    1.判断“无”以外的是否禁用

    当已选择的东西存在无且当前选项不是“无”就禁用

    2.判断“无”是否禁用

    当已选的东西不存在“无”且当前选择的数据长度大于0且当前的选项为“无”则禁用

    肖cc QQ2398506993
  • 相关阅读:
    blktrace分析IO
    Mac-配置SecureCRT
    Mac-安装itellij idea
    Mac-sublime text 3破解版
    Mac-item+zsh
    Mac-安装homebrew
    Mac-装机
    Mac-WIFI总是断网
    Git-ssh登录github
    Git-回滚操作
  • 原文地址:https://www.cnblogs.com/alecc1124/p/14333645.html
Copyright © 2011-2022 走看看