express一维数组转树形结构

最新推荐文章于 2023-12-14 09:37:59 发布
最新推荐文章于 2023-12-14 09:37:59 发布
阅读量213 收藏 3
点赞数
文章标签： dom installer glassfish cocos2d vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/u014534321/article/details/113879033
版权 
let menu = [
    {
        "id": 1,
        "name": "111",
        "parent": 0,
        "icon": "555,,"
    },
    {
        "id": 2,
        "name": "极地测试菜单2",
        "parent": 1,
        "icon": "/img/002.png"
    },
    {
        "id": 4,
        "name": "555",
        "parent": 2,
        "icon": "88"
    },
    {
        "id": 5,
        "name": "ddd",
        "parent": 2,
        "icon": "555.png"
    },
    {
        "id": 6,
        "name": "666",
        "parent": 4,
        "icon": null
    },
    {
        "id": 7,
        "name": "777",
        "parent": 5,
        "icon": null
    },
    {
        "id": 9,
        "name": "8888",
        "parent": 1,
        "icon": null
    },
    {
        "id": 10,
        "name": "9999",
        "parent": 9,
        "icon": null
    },
    {
        "id": 11,
        "name": "10000",
        "parent": 1,
        "icon": null
    }
]

function listToTree(list){
    //遍历整个列表
    return list.filter(cur=>{ 
        // 获取当前节点的子节点
        let children= list.filter(item=> item.parent == cur.id ); 
        if(children.length>0){
             cur.children=children;
        }
        //只返回顶级节点
        return cur.parent==0; 
    });
}

console.log(listToTree(menu));

第二种

let list =  [
    {
        "userID": "1",
        "roleName": "admin",
        "id": "2",
        "NAME": "菜单管理",
        "parent_id": "0",
        "sort": "1000",
        "url": "/sys/menu.html",
        "icon": "fa fa-th-list",
        "perms": "svs:menu:list",
        "type": "1",
        "creat_time": "13/7/2020 12:47:56",
        "update_time": "13/7/2020 12:47:56"
    },
    {
        "userID": "1",
        "roleName": "admin",
        "id": "3",
        "NAME": "角色管理",
        "parent_id": "2",
        "sort": "1000",
        "url": "/sys/role.html",
        "icon": "fa fa-key",
        "perms": "svs:role:list",
        "type": "1",
        "creat_time": "13/7/2020 12:47:56",
        "update_time": "13/7/2020 12:47:56"
    },
    {
        "userID": "1",
        "roleName": "admin",
        "id": "4",
        "NAME": "用户管理",
        "parent_id": "2",
        "sort": "1000",
        "url": "/sys/user.html",
        "icon": "fa fa-user",
        "perms": "svs:user:list",
        "type": "1",
        "creat_time": "13/7/2020 12:47:56",
        "update_time": "13/7/2020 12:47:56"
    },
    {
        "userID": "1",
        "roleName": "admin",
        "id": "5",
        "NAME": "添加",
        "parent_id": "5",
        "sort": "1000",
        "url": "",
        "icon": "",
        "perms": "sys:user:add",
        "type": "2",
        "creat_time": "13/7/2020 12:47:56",
        "update_time": "13/7/2020 12:47:56"
    },
    {
        "userID": "1",
        "roleName": "admin",
        "id": "6",
        "NAME": "修改",
        "parent_id": "5",
        "sort": "1000",
        "url": "",
        "icon": "",
        "perms": "sys:user:update",
        "type": "2",
        "creat_time": "13/7/2020 12:47:56",
        "update_time": "13/7/2020 12:47:56"
    },
    {
        "userID": "1",
        "roleName": "admin",
        "id": "7",
        "NAME": "删除",
        "parent_id": "5",
        "sort": "1000",
        "url": "",
        "icon": "",
        "perms": "sys:user:delete",
        "type": "2",
        "creat_time": "13/7/2020 12:47:56",
        "update_time": "13/7/2020 12:47:56"
    },
    {
        "userID": "1",
        "roleName": "admin",
        "id": "8",
        "NAME": "授权",
        "parent_id": "5",
        "sort": "1000",
        "url": "",
        "icon": "",
        "perms": "sys:user:assign",
        "type": "2",
        "creat_time": "13/7/2020 12:47:56",
        "update_time": "13/7/2020 12:47:56"
    },
    {
        "userID": "1",
        "roleName": "admin",
        "id": "9",
        "NAME": "添加",
        "parent_id": "3",
        "sort": "1000",
        "url": "",
        "icon": "",
        "perms": "sys:menu:add",
        "type": "2",
        "creat_time": "13/7/2020 12:47:56",
        "update_time": "13/7/2020 12:47:56"
    },
    {
        "userID": "1",
        "roleName": "admin",
        "id": "10",
        "NAME": "修改",
        "parent_id": "3",
        "sort": "1000",
        "url": "",
        "icon": "",
        "perms": "sys:menu:update",
        "type": "2",
        "creat_time": "13/7/2020 12:47:56",
        "update_time": "13/7/2020 12:47:56"
    },
    {
        "userID": "1",
        "roleName": "admin",
        "id": "11",
        "NAME": "删除",
        "parent_id": "3",
        "sort": "1000",
        "url": "",
        "icon": "",
        "perms": "sys:menu:delete",
        "type": "2",
        "creat_time": "13/7/2020 12:47:56",
        "update_time": "13/7/2020 12:47:56"
    },
    {
        "userID": "1",
        "roleName": "admin",
        "id": "12",
        "NAME": "添加",
        "parent_id": "4",
        "sort": "1000",
        "url": "",
        "icon": "",
        "perms": "sys:role:add",
        "type": "2",
        "creat_time": "13/7/2020 12:47:56",
        "update_time": "13/7/2020 12:47:56"
    },
    {
        "userID": "1",
        "roleName": "admin",
        "id": "13",
        "NAME": "修改",
        "parent_id": "4",
        "sort": "1000",
        "url": "",
        "icon": "",
        "perms": "sys:role:update",
        "type": "2",
        "creat_time": "13/7/2020 12:47:56",
        "update_time": "13/7/2020 12:47:56"
    },
    {
        "userID": "1",
        "roleName": "admin",
        "id": "14",
        "NAME": "删除",
        "parent_id": "4",
        "sort": "1000",
        "url": "",
        "icon": "",
        "perms": "sys:role:delete",
        "type": "2",
        "creat_time": "13/7/2020 12:47:56",
        "update_time": "13/7/2020 12:47:56"
    },
    {
        "userID": "1",
        "roleName": "admin",
        "id": "15",
        "NAME": "授权",
        "parent_id": "4",
        "sort": "1000",
        "url": "",
        "icon": "",
        "perms": "sys:role:assign",
        "type": "2",
        "creat_time": "13/7/2020 12:47:56",
        "update_time": "13/7/2020 12:47:56"
    }
]
function toTree(data) {
    let result = []
    if(!Array.isArray(data)) {
        return result
    }
    data.forEach(item => {
        delete item.children;
    });
    let map = {};
    data.forEach(item => {
        map[item.id] = item;
    });
    data.forEach(item => {
        let parent = map[item.parent_id];
        if(parent) {
            (parent.children || (parent.children = [])).push(item);
        } else {
            result.push(item);
        }
    });
    return result;
}
console.log(toTree(list))
一人创客
关注
商品服务1-三级分类-查询-递归树形结构数据获取
daokoi的博客
03-27 539
三级分类的页面形式举例。 第一步：在表pms_category中存入三级分类的所有数据。 第二步：向后端发送product/category/list/tree请求时，调用listWithTree()方法将三级分类的所有数据都组装成树形结构进行返回。 第三步：CategoryService中还没有listWithTree()方法，需要在这里先声明一下此方法，然后再去实现类中实现此方法。 第四步：在实现类实现listWithTree()方法时，首先要注入对应的dao，传统方法是用注解@Autowire
【GPU精粹与Shader编程】(四) 《GPU Gems 2》全书核心内容提炼总结 · 上篇
【浅墨的游戏编程Blog】毛星云（浅墨）的专栏
06-24 7209
《GPU Gems 2》这本书除了丰富的内容之外，还有两个特点。首先，《GPU Gems 2》是虚幻引擎之父Tim Sweeney作序。作为Epic Games的创始人，Unreal Engine早期主要开发者，Tim也在序中展示了《GPU Gems 2》出版伊始（2005年3月）时开发完成的Unreal Engine 3。UE3可谓是开创了一个时代。随后包括《新鬼泣》在内的100+款大作（200...
nodejs+express递归实现树形结构demo
12-14
最近用到了需要显示树形结构，经过几个小时的瞎整，做出了个示例，从查询数据到显示，包括CRUD
读取JSON格式转为DevExpress TreeList 树形（晨曦CZB）
03-08
读取JSON格式转为DevExpress TreeList 树形。整个发上来的，可以直接运行
解决express 路由获得不到前台数组
时意
09-28 306
nodejs+express+mysql(后台实例项目练习9—用户组管理 新增 列表展示 删除 功能增加) 数组的处理 如果想把前台的数组集合 传输到路由并存入数据库 要转义一次 groupList = groupList.join(','); 要不然 路由js 通过body 获得不到 虽然有这个对象 ...
前端一面常考手写面试题整理
helloworld1024fd的博客
02-13 367
运行的字符串代码被恶意方（不怀好意的人）操控修改，您最终可能会在您的网页/扩展程序的权限下，在用户计算机上运行恶意代码。提供可选的reviver函数用以在返回之前对所得到的对象执行变换(操作)其实是相同的，只是遍历的顺序相反，它是从数组的最后一项开始，向前遍历到第一项。函数处理过的对象，我们就可以方便地访问普通对象内部的深层属性。是一个危险的函数，他执行的代码拥有着执行者的权利。都有着动态编译js代码的作用，但是在实际的编程中并不推荐使用。在转换JSON的实际应用中，只需要这么做。渲染大数据时，合理使用。
非科班出身拿下字节跳动前端offer，我有一份50000字面试宝典分享给你！
pig_html的博客
03-22 4138
个人经历 本人211学校，回想我大一的时候，读的是机电工程，因为对计算机专业好就业比较看重，后来在大一下的时候开始了自己双学位之路，开始了学计算机专业，从此开始了科班生的生涯。接触前端也大概是在大一下学期，在一个叫腾讯课堂的地方偶然发现了一套 JS 的视频，看着感觉不错，想深入这个领域，但后来发现越往后面学越需要一些计算机科班的专业基础，于是我当时果断转到了计算机。因此这一步选择算得上偶然，也是一个必然。 大二上学校的课程压力比较大，不温不火地学了一个学期，中途有过做全栈的想法，报了个 Python Web
Python数据结构可视化：【实战指南】
Python作为一种高级编程语言，它提供的丰富数据类型和库，使得数据结构的可视化变得更加直观和易于理解。可视化不仅可以帮助开发者更直观地理解数据结构本身，也能让数据分析的结果更加易于传达和理解。 在这一章中...
计算机算法常用术语中英对照（分为两部分 其中一部分表格形式 ）
weixin_30488085的博客
06-25 4870
第一部分 Data Structures 基本数据结构 Dictionaries 字典 Priority Queues 堆 Graph Data Structures 图 Set Data Structures 集合 Kd-Trees 线段树 Numerical Problems 数值问题 Solving Linear Equations 线性方程组 B...
node 树形数据构建-无限分类
最新发布
m0_59586503的博客
12-14 425
提示：菜单导航。
一维数组转换成树结构的数组
qq_38682174的博客
02-23 2120
一维数组转换成树结构的数组,或者转成多节点的树结构，二维数组转换为未知节点数的树结构数组需要使用递归算法。
QLexpress源码解析
赵润泽
08-08 1658
一. 流程分析 表达式： 10 * 10 + 1 + 2 * 3 + 5 * 2 1：整体处理被 ExpressRunner 托管，可以在这个类里开启一些运行时辅助功能，比如 是否使用Cache中的指令集、是否输出详细的执行指令信息 等等,。 首先调用这个方法 ExpressRunner#execute(Sting，IExpressContext)：Object ，第一个参数是表达式，第二个是上下文。 2：然后调用 ExpressRunner#parseInstructionSet(String): Ins
集合 —— 数组转列表的四种方式
热门推荐
莪是男神的博客
10-17 1万+
由于 JDK 官方的短视，在早期，也就是 JDK1.0 时候的版本没能拥有泛型，直到 JDK 1.5 之后才引入了泛型，这个时候，JDK官方考虑到代码的兼容性问题，如果实现真的泛型的话，原先的 JDK1.0 的代码可能就无法运行了，为了保持代码的兼容性，在使用泛型的时候，在底层。这个第三方库的工具非常完善，有很多方法，不过主要有两种类型的的集合，一种为不可变集合，可以使用。其实，原因是这样的，此外，这个方法不适合基本数据类型的数组，必须要先将其转为其包装类的数组才行。int、double 和 long。
一维数组转树形结构
weixin_30666753的博客
01-25 275
2019-1-25 14:55:44 星期五 场景: 经销商有多个层级, 他们之间的组织架构像一颗树一样, 其中每个次级经销商只有一个上级经销商 但是数据库中存储的数据中, 每一条记录只记录了相邻两个上下级的经销商id 现在要根据数据库中的数据, 把所有经销商按照上下级关系整理出完整的链条 下边以a,b,c第代表不同的经销商 (也可以用于多层级目录中) 原理: 1. 如果读入了&l...
nodejs如何正确接收数组和对象
赵天铭的博客
11-10 9190
今天接收页面Form表单POST请求送来的多层对象，得到的数据如下： user[name]=zhao&user[pass]=111 因为Form表单默认的content-type是 x-www-form-urlencoded 那么nodejs怎么将上面的数据正确转成我们想要的数据？ 因为我用的是express框架，所以我默认就使用了body-parser这个中间件，得到的res.bo...
后台返回给前端数据处理成树形结构数据
weixin_30768175的博客
09-09 2176
后台返回给前端数据： [{ "id": "1", //唯一标识id "name": "女装/男装/内衣", "parentId": "0" //父级id}, { "id": "2", "name": "女装", "parentId": "1"}, { "id": "3", "name": "男装", "parentId"...
js中事件委托
FengYang_的博客
09-10 534
** js中事件委托 ** ** 概念 事件的委托是指利用冒泡的原理，把事件加到父级上，触发执行效果。 好处: 提高性能 案例 首先看不使用事件委托时的代码 如下： <html> <head lang="en"> <meta charset="UTF-8"> <title></title> <style> li { list-style: none;
编写一个函数将数据转化为树形结构并插入到路由中
05-25
我们可以编写如下的函数将数据转化为树形结构并插入到路由中： ```javascript function insertTreeToRouter(data, router) { // 用一个对象来存储每个节点的信息 const nodes = {}; // 遍历数据，将每个节点...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

一人创客

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值