說明：列表中字段A的值由多個值組成，但是后端返回的是這多個值的id字符串，需要前端拿著多個id組成的字符串去另一個接口數據源匹配展示
列表后端返回多個字符串如下：
sectorName: "1899292545382895618,1907311191514636289,1907311228177047553"cusType: "4,2",數據源1(模擬數據)：
sectorList: [{id:1,name:'測試1'},{id:2,name:'測試2'},{id:3,name:'測試3'},{id:4,name:'測試4'}
],數據源2(模擬數據)：
cusTypeList: [{dictKey:1,dictValue:'A'},{dictKey:2,dictValue:'B'},{dictKey:3,dictValue:'C'},{dictKey:4,dictValue:'S'}
],列表接口請求成功之后匹配方法如下：
api.querybasicRftTemplateRetrieveList(params).then((res) => {if(res.data.data == null){this.tableData = []}else{this.tableData = res.data.data.records;this.tablePage.totalElements = res.data.data.total;this.tableData.map((item) => {item.fieldType = String(item.fieldType);// 匹配行業名稱if (item.sectorName) {let sectorIdArr = item.sectorName.split(","); // 分割行業 IDitem.sectorNameStr = this.sectorList.filter(sector => sectorIdArr.includes(String(sector.id))).map(sector => sector.name).join("，"); // 拼接成字符串} else {item.sectorNameStr = "";}// 匹配客戶類型名稱if (item.cusType) {let cusTypeArr = item.cusType.split(","); // 分割客戶類型 IDitem.cusTypeNameStr = this.cusTypeList.filter(cus => cusTypeArr.includes(String(cus.dictKey))).map(cus => cus.dictValue).join("，"); // 拼接成字符串} else {item.cusTypeNameStr = "";}})this.getUsersList(this.tableData);}this.loading = false;}).catch(() => {this.loading = false;})🔍 代碼解析
-
item.sectorName.split(",")-
將
sectorName（字符串"1,2,3"）拆分為數組["1", "2", "3"]。
-
-
this.sectorList.filter(sector => sectorIdArr.includes(String(sector.id)))-
過濾
sectorList，只保留id在sectorIdArr里的項。
-
-
.map(sector => sector.name).join("，")-
提取
name并用，連接成字符串。
-
客戶類型 cusTypeNames 處理邏輯類似。
列表直接使用：sectorNameStr 字段渲染即可
效果如下：
至此完成！！！
測試有效！！！感謝支持！！！
)
