// js实现树级递归,
// 通过js生成tree树形菜单(递归算法) const data = [
{ id: 1, name: "办公管理", pid: 0 },
{ id: 2, name: "请假申请", pid: 1 },
{ id: 3, name: "出差申请", pid: 1 },
{ id: 4, name: "请假记录", pid: 2 },
{ id: 5, name: "系统设置", pid: 0 },
{ id: 6, name: "权限管理", pid: 5 },
{ id: 7, name: "用户角色", pid: 6 },
{ id: 8, name: "菜单设置", pid: 6 },
]; function toTree(data){
const map = {};
data.forEach(item => {
map[item.id] = {...item};
});
const result= [];
data.forEach((item)=>{
const parent = map[item.pid];
if(parent){
if(!parent.children) parent.children =[];
parent.children.push(item);
}else{
result.push(item);
}
})
return result;
}
console.log(toTree(data));

**********************************

https://segmentfault.com/a/1190000011283221

https://segmentfault.com/a/1190000016226334

https://segmentfault.com/a/1190000003004435

https://blog.csdn.net/chaos_hf/article/details/80150911

https://www.jianshu.com/p/b4d8085e84bd

https://blog.csdn.net/zhangchao19890805/article/details/75195512

toTree的更多相关文章

  1. Scalaz(24)- 泛函数据结构: Tree-数据游览及维护

    上节我们讨论了Zipper-串形不可变集合(immutable sequential collection)游标,在串形集合中左右游走及元素维护操作.这篇我们谈谈Tree.在电子商务应用中对于xml, ...

  2. 好用的php类库和方法

    1, /** * 将一个平面的二维数组按照指定的字段转换为树状结构 * * 用法: * @code php * $rows = array( * array('id' => 1, 'value' ...

  3. tree的遍历--广度优先遍历

    一.二叉树demo var tree = { value: '一', left: { value: '二', left: { value: '四', right: { value: '六' } } } ...

  4. gradle编译自定义注解(annotation)的未解决问题

    最近把一个用eclipse构建的项目,加上了Gradle脚本,用它来编译.虽然最后编译是显示BUILD SUCCESSFUL,但是在编译过程中,却打印出一大堆栈信息,似乎是在编译我自定义的注解时出现的 ...

  5. C#生成树形结构泛型类

    C#生成树形结构泛型类,使用方法: ToTree<ShowMessageUpdatesTableTreeViewModel>.ToDo(models) public class ToTre ...

  6. bootstrap treeview 树形数据生成

    这个问题还是挺经典的,后台只是负责查出所有的数据,前台js来处理数据展示给treeview;show you the code below:<script> $(function () { ...

  7. Laravel-nestedset that base left and right values tree package

    This is a Laravel 4-5 package for working with trees in relational databases. Laravel 5.5, 5.6, 5.7, ...

  8. c#所有部门及其下所部门生成树形图(递归算法获取或键值对方式获取)

    部门数据库的设计: 代码: /// <summary> /// 获取部门(入口) /// </summary> /// <returns></returns& ...

  9. js 数组 转为树形结构

    题目: source = [{ id: 1, pid: 0, name: 'body' }, { id: 2, pid: 1, name: 'title' }, { id: 3, pid: 2, na ...

随机推荐

  1. 阿里中间件——消息中间件Notify和MetaQ

    3.1.Notify Notify是淘宝自主研发的一套消息服务引擎,是支撑双11最为核心的系统之一,在淘宝和支付宝的核心交易场景中都有大量使用.消息系统的核心作用就是三点:解耦,异步和并行.下面让我以 ...

  2. UVA12545-Bits Equalizer(思维)

    Problem UVA12545-Bits Equalizer Accept: 821  Submit: 4548Time Limit: 3000 mSec Problem Description I ...

  3. MacOS 10.12 Sierra 安全性与隐私没有任何来源选项解决方法

    MacOS 10.12 Sierra 安全性与隐私没有任何来源选项解决方法 来源: 时间:2016年09月21日 在升级了macOS Sierra (10.12)版本后在“安全性与隐私”中不再有“任何 ...

  4. 第11章 AOF持久化

    AOF持久化在硬盘上保存的是对Redis进行的逻辑操作,类似InnoDB中的bin log.说白了就是你对一个Redis输入了哪些语句,AOF文件都会原封不动的保存起来,等到需要回复Redis的时候再 ...

  5. Python:Day55 ORM多表操作

    命令行创建UTF8数据库: CREATE DATABASE 数据库名称 DEFAULT CHARSET utf8 COLLATE utf8_general_ci; 创建多表(外键)

  6. 项目代码迁移(使用git)

    克隆老仓库(裸仓库):git clone --bare git@codehub.devcloud.huaweicloud.com:e2f197xxxxxxx19fc4ae7348b2ed41/Node ...

  7. Java NIO3:缓冲区Buffer

    在上一篇中,我们介绍了NIO中的两个核心对象:缓冲区和通道,在谈到缓冲区时,我们说缓冲区对象本质上是一个数组,但它其实是一个特殊的数组,缓冲区对象内置了一些机制,能够跟踪和记录缓冲区的状态变化情况,如 ...

  8. BZOJ4361 isn 树状数组、DP、容斥

    传送门 不考虑成为非降序列后停止的限制,那么答案显然是\(\sum\limits_{i=1}^N cnt_i \times (N-i)!\),其中\(cnt_i\)表示长度为\(i\)的非降序列数量 ...

  9. 记一次Dubbo服务注册异常

            公司项目重构,把dubbo版本从2.5.8升级为2.6.2.升级后在本地运行一点问题都没有:可是通过公司自研的发布系统将项目发布到测试环境的linux服务器下面后,出现了dubbo服务 ...

  10. SQLite 实现删除表中前一天的数据

    注意点1 要注意SQLite datatime()函数为何获取不到系统本地时间?这个问题,坑死我了. 解决方法详见这篇文章:SQLite datatime()函数为何获取不到系统本地时间? 注意点2: ...