VUE如何遍历数组，将数组中特定属性相同的对象合并

Question

[
    {
        "userList": [
            {
                "id": "2812c3a07180442c87c088f94c44ea72",
                "corpSuiteId": "db3c79ba4e184ab08b123f3c219f1d9f",
                "corpId": "dingc7c13fc9fb029197f5bf40eda33b7ba0",
                "name": "莫文",
                "pingying": "mowen",
                "avatar": "",
                "mobile": null,
                "telephone": null,
                "email": null,
                "orgEmail": null,
                "workPlace": null,
                "userid": "04062129631213546",
                "unionid": "E3u2dZiSvuiSRNXX7kCntiPngiEiE",
                "deptIds": "654370065",
                "active": "1",
                "hiredDate": null,
                "jobNumber": "",
                "title": "",
                "managerUserid": null,
                "nickname": null,
                "senior": "0",
                "admin": "1",
                "boss": "0",
                "roleLists": null,
                "lastLoginDate": "2023/10/10 15:51:07",
                "guideFlag": "1",
                "imitate": null,
                "remark": null,
                "createBy": "1",
                "createDate": "2022/06/11 17:31:41",
                "updateBy": "1",
                "updateDate": "2023/09/20 11:35:03",
                "delFlag": "0",
                "channel": "ding",
                "roleId": "ce16e117b54e4c73897a6a64d1b45a9b",
                "roleName": "设计"
            }
        ],
        "userIds": "2812c3a07180442c87c088f94c44ea72",
        "roleName": "设计",
        "id": "ce16e117b54e4c73897a6a64d1b45a9b",
        "flowId": "72144bb2e00f4756be8141d4eb7f8b01"
    },
    {
        "userList": [
            {
                "id": "18825d4dc4ae4b56acc34de4b2a1cdc7",
                "corpSuiteId": "db3c79ba4e184ab08b123f3c219f1d9f",
                "corpId": "dingc7c13fc9fb029197f5bf40eda33b7ba0",
                "name": "云清",
                "pingying": "yunqing",
                "avatar": "https://static-legacy.dingtalk.com/media/lQDPM4_b5pTu8ITNBDfNBDewQbvYcs8WiewD6lLYtUD5AA_1079_1079.jpg",
                "mobile": null,
                "telephone": null,
                "email": null,
                "orgEmail": null,
                "workPlace": null,
                "userid": "23133251591254872",
                "unionid": "UiPNgnHFhF0I8yvJvPf1asQiEiE",
                "deptIds": "654370065",
                "active": "1",
                "hiredDate": null,
                "jobNumber": "",
                "title": "",
                "managerUserid": null,
                "nickname": null,
                "senior": "0",
                "admin": "1",
                "boss": "0",
                "roleLists": null,
                "lastLoginDate": "2023/10/31 17:16:20",
                "guideFlag": "1",
                "imitate": null,
                "remark": null,
                "createBy": "1",
                "createDate": "2022/06/11 17:31:40",
                "updateBy": "1",
                "updateDate": "2023/07/19 17:38:00",
                "delFlag": "0",
                "channel": "ding",
                "roleId": "6677150bbe5e4095a83628a9c223b626",
                "roleName": "文员"
            }
        ],
        "userIds": "18825d4dc4ae4b56acc34de4b2a1cdc7,85235a6187334759bd3fd72fcfc17ce5",
        "roleName": "文员",
        "id": "6677150bbe5e4095a83628a9c223b626",
        "flowId": "72144bb2e00f4756be8141d4eb7f8b01"
    },
    {
        "userList": [
            {
                "id": "57dd7ea53c0948c5be86163584149d07",
                "corpSuiteId": "db3c79ba4e184ab08b123f3c219f1d9f",
                "corpId": "dingc7c13fc9fb029197f5bf40eda33b7ba0",
                "name": "夏天XT",
                "pingying": "xiatianXT",
                "avatar": "",
                "mobile": null,
                "telephone": null,
                "email": null,
                "orgEmail": null,
                "workPlace": null,
                "userid": "3115670822701142646",
                "unionid": "yHrVTpeWZ0mgkfwW1VfLwwiEiE",
                "deptIds": "654370065",
                "active": "1",
                "hiredDate": null,
                "jobNumber": "",
                "title": "",
                "managerUserid": null,
                "nickname": null,
                "senior": "0",
                "admin": "0",
                "boss": "0",
                "roleLists": null,
                "lastLoginDate": "2023/10/23 13:48:05",
                "guideFlag": "1",
                "imitate": null,
                "remark": null,
                "createBy": "1",
                "createDate": "2022/07/18 10:06:09",
                "updateBy": "1",
                "updateDate": "2023/08/21 22:02:31",
                "delFlag": "0",
                "channel": "ding",
                "roleId": "5cf759b732e44c629589dfc571772be1",
                "roleName": "行政主管"
            }
        ],
        "userIds": "57dd7ea53c0948c5be86163584149d07",
        "roleName": "行政主管",
        "id": "5cf759b732e44c629589dfc571772be1",
        "flowId": "72144bb2e00f4756be8141d4eb7f8b01"
    }
]

目标结构：{
“roleName”: ""
“roleName”: "18825d4dc4ae4b56acc34de4b2a1cdc7,85235a6187334759bd3fd72fcfc17ce5"
“roleName”: "2812c3a07180442c87c088f94c44ea72"
}

Answer 1

• 根据roleName将userList中的id进行合并
  方法：

const data = [ /* 你提供的数组数据 */ ];

let resultMap = {};

data.forEach(item => {
  const roleName = item.roleName;
  
  if (!resultMap[roleName]) {
    resultMap[roleName] = [];
  }
  
  // 添加userList中的id到结果中
  item.userList.forEach(user => {
    resultMap[roleName].push(user.id);
  });
});

// 转换数组为逗号分隔的字符串
for (const key in resultMap) {
  resultMap[key] = resultMap[key].join(',');
}

console.log(resultMap);

• 先定义了一个空对象resultMap来存放结果。然后遍历你提供的数组中的每个对象。对于每个对象，先检查该对象的roleName是否已经存在于resultMap中。如果不存在，它将roleName添加到resultMap中并初始化为一个空数组。然后它遍历userList并将每个用户的id添加到结果数组中。

• 执行上述代码后，resultMap将包含你想要的结构，其中每个roleName对应的值都是一个包含userList中用户id的逗号分隔的字符串。