element循环渲染el-select控制change变disabled状态

在这里插入图片描述

            <div style="display: flex; align-items: flex-end">
              <div>
                <div
                  v-for="(itemValue, index) in obj.addProductInfo.basisValue"
                  :key="index"
                  class="item"
                >
                  <el-select
                    :ref="'selectRef'+itemValue.code"
                    filterable
                    v-model="itemValue.code"
                    placeholder="请选择"
                    @change="(e) =>standardsChange(e,itemValue,num,obj.addProductInfo.basisValue)"
                    style="width: 380px"
                  >
                    <div v-for="(item, index) in projectParams" :key="index">
                      <el-option
                        :label="item.label"
                        :value="item.value"
                        :disabled="item.disabled"
                      ></el-option>
                    </div>
                  </el-select>
                </div>
              </div>
              <div>
                <el-button
                  type="primary"
                  @click="addFn"
                  style="margin-left: 16px"
                  >+ 添加</el-button
                >
              </div>
            </div>
//新增方法
    addFn(arr) {
      this.getChoiceArr(arr)
      this.tabsOptions.map((v) => {
        console.log(v, "v");
        if (v.value == this.activeName) {
          v.addProductInfo.basisValue.push({
            code: "",
            name:''
          });
        }
      });
//下拉框change事件
    standardsChange(e,obj,num,arr) {
      //obj新增的每一项的对象
      //arr就是存放所有新增的数据
      this.getChoiceArr(obj,num,arr)
    },
    
    //抽离的方法
     getChoiceArr(row,num,arr) {
      var idx = -1;
      this.projectParams.forEach((t,index) => {
        arr.forEach(item => {
          if (item.code == t.value) {
              t.disabled = true;
              idx = index
            }
        })
         if (idx != index) {
            t.disabled = false;
          } 
      });
    }, 

在这里插入图片描述

参考文档:https://blog.youkuaiyun.com/xiaojuju0/article/details/129825775

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值