扁平的数据转树状数据

扁平的数据转树状数据

let subData = [
    {name: "1", id: "1"},
    {name: "1-1", id: "1-1"},
    {name: "1-1-1", id: "1-1-1"},
    {name: "1-2", id: "1-2"},
    {name: "1-2-1", id: "1-2-1"},
    {name: "1-2-2", id: "1-2-2"},
    {name: "2", id: "2"},
    {name: "2-1", id: "2-1"},
    {name: "2-2", id: "2-2"},
    {name: "3", id: "3"},
    {name: "3-1", id: "3-1"},
    {name: "3-2", id: "3-2"},
    {name: "3-1-1", id: "3-1-1"},
    {name: "4", id: "4"},
    {name: "10", id: "10"},
    {name: "10-1", id: "10-1"},
    {name: "10-1-10", id: "10-1-10"}
]

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

给定一个扁平的数据转成树状数据，以id区分层级

function getData(arr) {
    // 顶层数据
    let parentData = arr.filter(item => {
        return !item.id.includes("-");
    })
    // 所有子数据
    let childrenData = arr.filter(item => {
        let atr = item.id.includes("-")
        if (atr) {
            let atr2 = item.id.split("-");
            atr2.pop();
            let atr3 = atr2.join("-");
            // 所有的子数据添加parentID字段，等于父级的id
            item.parentID = atr3；
        }
        return atr;
    })

    let translator = (parentData, childrenData ) => {
        parentData.forEach((parent) => {
                childrenData.forEach((current, index) => {
                        if (current.parentID === parent.id) {
                            let temp = JSON.parse(JSON.stringify(children))
                            temp.splice(index, 1)
                            translator([current], temp);
                            typeof parent.children !== 'undefined' ? parent.children.push(current) : parent.children = [current]
                        }
                    }
                )
            }
        )
    }

    translator(parentData, childrenData)
    return parents
}

// 调用方法
getData(subData)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39

最后输出结果：

[
    {
        "name": "1",
        "id": "1",
        "children": [
            {
                "name": "1-1",
                "id": "1-1",
                "parentID": "1",
                "children": [
                    {
                        "name": "1-1-1",
                        "id": "1-1-1",
                        "parentID": "1-1"
                    }
                ]
            },
            {
                "name": "1-2",
                "id": "1-2",
                "parentID": "1",
                "children": [
                    {
                        "name": "1-2-1",
                        "id": "1-2-1",
                        "parentID": "1-2"
                    },
                    {
                        "name": "1-2-2",
                        "id": "1-2-2",
                        "parentID": "1-2"
                    }
                ]
            }
        ]
    },
        {
            "name": "2",
            "id": "2",
            "children": [{
                "name": "2-1",
                "id": "2-1",
                "parentID": "2"
            },
                {
                    "name": "2-2",
                    "id": "2-2",
                    "parentID": "2"
                }
            ]
        },
        {
            "name": "3",
            "id": "3",
            "children": [
                {
                    "name": "3-1",
                    "id": "3-1",
                    "parentID": "3",
                    "children": [
                        {
                            "name": "3-1-1",
                            "id": "3-1-1",
                            "parentID": "3-1"
                        }
                    ]
                },
                {
                    "name": "3-2",
                    "id": "3-2",
                    "parentID": "3"
                }
            ]
        },
        {
            "name": "4",
            "id": "4"
        },
        {
            "name": "10",
            "id": "10",
            "children": [
                {
                    "name": "10-1",
                    "id": "10-1",
                    "parentID": "10",
                    "children": [
                        {
                            "name": "10-1-10",
                            "id": "10-1 -10",
                            "parentID": "10-1"
                        }
                    ]
                }
            ]
        }
    ]
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97