Vue实战，如何将扁平化数据转化为树形结构的数据

授人以鱼不如授人以渔

在日常的项目开发中，后端给我们前端的数据往往不是直接可以用的，此时，需要我们前端同学发挥自己的智慧二次加工一下数据，今天给大家分享的是扁平化数据转化为树形结构的数据！！！

// 将扁平化数据转化为树形结构的数据

// 核心思想：寻找父节点

// 思路：遍历需要转化数据的数组，如果数组里面的pid与某个id相匹配，那么这个pid就是id的子节点

// 代码落地
export function tree(list) {
    const treeList = []
    const map = {}
    // 遍历list数组，加入一个对象里面，id作为key.数组的item作为value
    list.forEach( (item) => {
        map[item.id] = item
        item.children = []
    })
    // 再次遍历list数组，如果map对象id与pid匹配成功，添加至item.children里面，反之，添加到treeList里面
    list.forEach( (item) => {
        if (map[item.pid]) {
            map[item.pid].children.push(item)
        } else {
            treeList.push(item)
        }
    })
    return treeList
}