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

java 复制代码

 <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

java 复制代码

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

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

java 复制代码

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> 组件的选项列表

java 复制代码

<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 的合并结果，可以使用该数组同时在"本单位"和"其他单位"之间进行选择

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

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