将两个回显的数据变为一个 使两个地方都显示这个总回显

 <el-col :span="8">
        <el-form-item :label="`第${index + 1}位监督检查人`" style="margin-left: -40px" required>
          <el-select v-model="item.superviseName" filterable :placeholder="`请选择第${index + 1}位监督检查人`">
            <div v-if="item.isSpDept === 'Y'">
              <el-option v-for="option in userList" :key="option.userId" :label="option.label"
                         :value="option.userId">
              </el-option>
            </div>
            <div v-else>
              <el-option v-for="option in otherUserList" :key="option.userId" :label="option.label"
                         :value="option.userId">
              </el-option>
            </div>
          </el-select>
        </el-form-item>
      </el-col>        


userList: [],
otherUserList: [],              






created() {
let _this = this;
this.user = this.$store.getters.user;
this.form.createByName = this.user.nickName;
// this.form.caseType=this.radio;
console.log(_this.source === 0)
if (this.source === 0) {
  console.log(this.source, '来源类型')
  _this.sourceType = 0
}
// 回显详情
console.log(this.caseId, 'id')
if (this.caseId !== "") {
  caseDetail({
    caseId: this.caseId
  }).then((response) => {
    console.log(response.data, '结果')
    if (response.data) {
      response.data = this.delEmptyQueryNodes(
        this.delEmptyQueryNodes(response.data)
      );
      this.form = response.data;
      this.radio = this.form.caseType;
      this.radioClient = this.form.clueType == 1 ? "单位" : "个人";
      console.log("form值", this.form);
      this.form.createByName = this.user.nickName;
      if (this.form.checkUserList == "") {
        this.form.checkUserList = [];
      }
      // 县局科室登记案源 默认为分流 不需要再选择分流方式
      // 县局人员判断条件为当前用户dept_info_id字段是否为101 是101 为县局人员,非101 则为分局或大队人员
      if (String(this.$store.state.user.user.deptInfoId) == "101") {
        // 0:备案  1:分流
        this.form.recordFlag = "1";
      }
    }
  });
} else {
  // 县局科室登记案源 默认为分流 不需要再选择分流方式
  // 县局人员判断条件为当前用户dept_info_id字段是否为101 是101 为县局人员,非101 则为分局或大队人员
  if (String(this.$store.state.user.user.deptInfoId) == "101") {
    // 0:备案  1:分流
    this.form.recordFlag = "1";
  }
}
// 获取本单位人员下拉框
// isNotDeptInfo:为空则默认查询本单位  不为空则默认查询非本单位人员
listCheckUser(2, true).then((response) => {
  this.userList = response.rows.map((d) => {
    d.label = `${d.nickName}`;
    return d;
  });
});

// 获取其他单位人员下拉框
// isNotDeptInfo:为空则默认查询本单位  不为空则默认查询非本单位人员
listCheckUser(1, true, true
).then(
  (response) => {
    this.otherUserList = response.rows.map((d) => {
      d.label = `${d.nickName}`;
      if (d.deptInfoName) {
        d.label = `${d.nickName}(${d.deptInfoName})`;
      }
      return d;
    });
  }
);将两个回显数据加在一起  使合并的回显数据同时在“本单位”和“其他单位”之间进行选择。

完善:

要将两个回显数据加在一起,您可以使用 concat() 方法将 userList 和 otherUserList 数组合并为一个新的数组,并将该数组赋给一个新的属性,例如 combinedUserList。然后,将 combinedUserList 用于渲染 <el-select> 组件的选项列表。

以下是一种可能的实现方法:

首先,在 data 中添加一个新的属性 combinedUserList

data() {
  return {
    userList: [],
    otherUserList: [],
    combinedUserList: [],
    // ...
  };
},

然后,在 created 钩子函数中,将 userList 和 otherUserList 数组合并到 combinedUserList

created() {
  // ...
  listCheckUser(2, true).then((response) => {
    this.userList = response.rows.map((d) => {
      d.label = `${d.nickName}`;
      return d;
    });
    
    this.combinedUserList = this.userList.concat(this.otherUserList);
  });

  // ...
},

最后,将 combinedUserList 用于渲染 <el-select> 组件的选项列表

<el-select v-model="item.superviseName" filterable :placeholder="`请选择第${index + 1}位监督检查人`">
  <el-option v-for="option in combinedUserList" :key="option.userId" :label="option.label" :value="option.userId"></el-option>
</el-select>

现在,combinedUserList 数组包含了 userList 和 otherUserList 的合并结果,可以使用该数组同时在“本单位”和“其他单位”之间进行选择

  • 5
    点赞
  • 10
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值