美文网首页
el-select 选择对象 value-key属性

el-select 选择对象 value-key属性

作者: jesse28 | 来源:发表于2022-06-14 11:39 被阅读0次

引用:https://blog.csdn.net/wu_yans/article/details/107459565
相当于el-select中的v-model要绑定一个对象。

  <!-- 指定分组start -->
        <div v-if="radiostatus=='指定分组'" style="margin-left:125px;">
          <div style="margin-bottom: 15px;" v-for="(v, index) in checkObjectArr" :key="index">
            <span style="margin-right:20px">分组{{index+1}}</span>
            <!-- 人员 -->
            人员
            <el-select @focus="handleGroupList" value-key="userId" filterable clearable multiple style="margin-right:20px" v-model="v.checkUserIdName" placeholder="请选择" class="select">
              <el-option v-for="item in checkuserOptions" :key="item.userId" :label="item.userName" :value="item">
              </el-option>
            </el-select>
            <!-- 对象 -->
            对象
            <el-select style="width:300px" value-key="objectId" @remove-tag="handleremoveTag" filterable  v-model="v.checkObjectIdName" multiple placeholder="请选择" class="select" @change="handleDisabled">
              <el-option v-for="item in checkObjectOptions" :disabled="item.disabled" :key="item.objectId" :label="item.objectName" :value="item">
              </el-option>
            </el-select>
            <!-- 删除一行-->
            <el-button style="margin-left:20px;" plain icon="el-icon-minus" @click="deleteItem(index)" type="danger" v-if="index !== 0"></el-button>
            <!-- 添加一行 -->
            <el-button style="margin-left:20px" @click="Addrule" type="primary" plain icon="el-icon-plus" v-if="index == 0"></el-button>
          </div>
        </div>
        <!-- 指定分组end -->
data(){
return {
  checkObjectArr: [
        {
          checkUserIdName: "",
          checkObjectIdName: "",
          isChange: "0",
        },
      ],
}
}
    //  加一行
    Addrule() {
      this.checkObjectArr.push({
        checkUserIdName: "",
        checkObjectIdName: "",
        isChange: "0",
      });
    },
   // 减一行
    deleteItem(index) {
       console.log('删除一行数组',JSON.parse(JSON.stringify(this.checkObjectArr)))
      console.log('删除一行',index)
      this.checkObjectArr[index].checkObjectIdName.forEach(item=>{
        this.checkObjectOptions.forEach(item1=>{
          if(item.objectId ==item1.objectId){
            item1.disabled = false
          }
        })
        
      })
      this.checkObjectArr.splice(index, 1);
    },

三层循环

 if (this.radiostatus == "指定分组") {
        let objTotal = [];
        let obj = [];
        this.checkObjectArr.forEach((item) => {
          item.checkObjectIdName.forEach((item1) => {
            obj = item.checkUserIdName.map((item2) => {
              return {
                checkUserId: item2.userId,
                checkUserName: item2.userName,
                checkObjectId: item1.objectId,
                checkObjectName: item1.objectName,
                isChange: "0",
                checkObjectStr: "",
              };
            });
            objTotal.push(obj);
          }); //第二次循环
          console.log("objTotal", objTotal);
        }); //最外围循环
        console.log("解构", ...objTotal);
        console.log("解构合并", [].concat(...objTotal));
        this.checkObjectGroup = [].concat(...objTotal);
      }

相关文章