arr2tree

最新推荐文章于 2024-09-19 06:55:03 发布

原创最新推荐文章于 2024-09-19 06:55:03 发布 · 641 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#js

js 专栏收录该内容

34 篇文章

订阅专栏

该博客内容展示了如何使用JavaScript将包含父级ID的数组转换为树形结构数据。通过遍历数组两次，首先创建一个以ID为键的对象，然后根据PID将子项添加到对应的父项中，最终构建出树结构。

数组转树结构数据。

function arr2tree (arr) {
    const arrObj = {};
    arr.forEach(item => {
        arrObj[item.id] = {
            ...item,
            children: [],
        };
    });

    const tree = [];
    arr.forEach(item => {
        if(!item.pid) {
            tree.push(arrObj[item.id]);
        } else {
            arrObj[item.pid].children.push(arrObj[item.id]);
        }
    })
    return tree;
}

const arr = [
    {
        id: 1,
        pid: null,
        text: '1',
    },
    {
        id: 2,
        pid: 1,
        text: '2'
    },
    {
        id: 3,
        pid: 1,
        text: '3'
    }
]

const a = arr2tree(arr);
console.dir(a);