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
  • 相关阅读:
    鸡哥的限币令(有上下限的网络流/费用流问题)
    AtCoder Regular Contest 128 部分题题解
    一道题
    2021CCPC河南省赛
    10.26训练赛
    博弈论和SG函数
    10.24训练赛
    10.22训练赛
    CF #749
    atcoder ABC233
  • 原文地址:https://www.cnblogs.com/alecc1124/p/14333645.html
Copyright © 2011-2022 走看看