列表数据转树形数据

AlienZHOU 发布于2019-08-21 18:29 / 2546人阅读

let listToTree = (list, id = "id", pId = "pId") => {
    let map = {},
        listMap = {},
        rootList = [];
    for (let i = 0, max = list.length; i < max; i++) {
        let one = Object.assign({}, list[i]);
        map[one[id]] = one;
        if (listMap[one[id]]) {
            one.children = listMap[one[id]];
        }
        if (one.hasOwnProperty(pId) && one[pId] !== "") {
            if (map[one[pId]]) {
                let c = map[one[pId]].children || (map[one[pId]].children = []);
                c.push(one);
            } else {
                if (!listMap[one[pId]]) listMap[one[pId]] = [one];
                else listMap[one[pId]].push(one);
            }
        } else {
            rootList.push(one);
        }
    }
    return { list: rootList, map };
};

使用

let data=[{
    id:1,
    text:"1"
},{
    id:2,
    pId:1,
    text:"2"
}];

let tree=listToTree(data);

GPU云服务器云服务器 java 列表转树形 android树形列表 js 树形菜单数据 js 树形数据遍历

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/90514.html

前端笔试题：数组转树形结构

摘要：初始化数据输出结果转换函数这个转换函数不受数据关系层级的限制，无论有多少层关系，只要一次循环就能搞定。所有人拿一根线，从他自己的位置开始，走到他父亲的位置，那么这个树形结构就完成了。只要每个节点都做完了，树形就出来了。初始化数据 var data = [ { parentId: 0, id: 1, value: 1 }, { parentId: 3, id: 2, v...

molyzzx 2019-08-23 15:54 评论0 收藏0
一个基于vue和element-ui的树形穿梭框组件

摘要：在市面上找到一个好用的树形穿梭框组件都很难，又不想仅仅因为一个穿梭框在之外引入其他重量级插件，因此就有了。版本增加穿梭框左侧右侧数据勾选事件，穿梭框左侧右侧底部。 el-tree-transfer 简介·请先阅读文档及版本说明因为公司业务使用vue框架，ui库使用的element-ui。在市面上找到一个好用的vue树形穿梭框组件都很难，又不想仅仅因为一个穿梭框在element-ui之...

Corwien 2019-08-22 18:33 评论0 收藏0
localStorage实现本地储存树形菜单

摘要：因为任务需要添加到树的结构上，所以要记录任务是添加到哪个结点上的，需要为每个树结点添加一个作为标识以便于在结点上添加任务，树状结构中每个结点的按照树的先序遍历将结点的依次储存于数组中。 localStorage实现本地储存树形菜单最近在写一个Todo-list的页面，页面布局和操作都写完后，想要用localStorage实现本地储存。然而对储存数据的方法一无所知，就先去了解了web的...

William_Sang 2019-08-21 10:56 评论0 收藏0