根据对象数组属性将数组对象分割成多个数组

约定不等于承诺〃 2023-02-21 11:57 87阅读 0赞

场景：

已选组织类型数据（这里包含多个不同的组织类型），前端需要展示不同组织类型下，已选的组织数据。

分析：

后端返回的是一个没有分组的对象数组，前端需要实现根据对象数组中对象的某个属性进行分类显示。

举例：

后端返回的数据结构如：

[{
        CreateTime: "2020-06-22 16:36:11"
        OrgType: "财务"
        OrgTypeCode: "5"
        Count: "1000"
        UpdateTime: "2020-06-22 16:36:11"
    },
    {
        CreateTime: "2020-06-22 16:36:11"
        OrgType: "人事"
        OrgTypeCode: "4"
        Count: "5"
        UpdateTime: "2020-06-22 16:36:11"
    },
    {
        CreateTime: "2020-06-22 16:36:11"
        OrgType: "技术"
        OrgTypeCode: "3"
        Count: "99"
        UpdateTime: "2020-06-22 16:36:11"
    },
    {
        CreateTime: "2020-06-22 16:36:11"
        OrgType: "人事"
        OrgTypeCode: "4"
        Count: "10"
        UpdateTime: "2020-06-22 16:36:11"
    }...]

前端需要拿到的是多个数组。

相关代码：

//根据数组对象属性分割成多个数组(已选组织进行分组显示)
        classify(arr){
            //console.log("classify",arr);
            let obj = {}
            arr.map(v => {
                obj[v.OrgType] = 0  
            })
            let OrgTypeArr = Object.keys(obj)
            // console.log('OrgTypeArr', OrgTypeArr)
            let result = OrgTypeArr.map(v => {
                return {
                data: arr.filter(_v => v == _v.OrgType)
                }
            })
            return result
        },

分割后的数据结构

[{
       data:[
            {
                CreateTime: "2020-06-22 16:36:11"
                OrgType: "财务"
                OrgTypeCode: "5"
                Count: "1000"
                UpdateTime: "2020-06-22 16:36:11"      
            }
        ]
    },
    {
        data:[
            {
                 CreateTime: "2020-06-22 16:36:11"
                 OrgType: "人事"
                 OrgTypeCode: "4"
                 Count: "5"
                 UpdateTime: "2020-06-22 16:36:11"        
            },
            {
                 CreateTime: "2020-06-22 16:36:11"
                 OrgType: "人事"
                 OrgTypeCode: "4"
                 Count: "10"
                 UpdateTime: "2020-06-22 16:36:11"
            }
        ]
    },
    {
        data:[
            {
                CreateTime: "2020-06-22 16:36:11"
                OrgType: "技术"
                OrgTypeCode: "3"
                Count: "99"
                UpdateTime: "2020-06-22 16:36:11"
            }
        ]
    }]

我们可以通过遍历这个数组，获取到我们需要的数据