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.pid];
if(parent) {
(parent.children || (parent.children = [])).push(item);
} else {
result.push(item);
}
});
return result;
}
var source2 = [
{ id: 1, pid: 0, name: '扬水设备' },
{ id: 'ys1', pid: 1, name: '扬水1' },
{ id: 'yszj', pid: 'ys1', name: '扬水子集' },
{ id: 'lxb', pid: 1, name: '离心泵' },
{ id: 'lsbzj', pid: 'lxb', name: '离心泵子集' },
{ id: 6, pid: 0, name: 'body' },
{ id: 2, pid: 6, name: 'title' },
{ id: 3, pid: 6, name: 'div' },
{ id: 4, pid: 3, name: 'span' },
{ id: 5, pid: 3, name: 'icon' }
]
console.log(toTree(source2))
</script>

简单的json数组转换树形结构.仅作记录

简单的JSON数组转树形结构的更多相关文章

  1. 后台返回平铺数据,如何转换成树形json并渲染树形结构,ant tree 异步加载

    如何后台返回对象数组(平铺式) 1.根据字段标识(板块)获取根节点 ### initTreeData(dataOrg){ var resultArr=dataOrg[0] var secArr=[]; ...

  2. Json数据产生树形结构

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <hea ...

  3. js 数组 转为树形结构

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

  4. JS 树形结构与数组结构相互转换、在树形结构中查找对象

    总是有很多需求是关于处理树形结构的,所以不得不总结几个常见操作的写法.¯\_(ツ)_/¯ 首先假设有一个树形结构数据如下 var tree=[ { 'id': '1', 'name': '教学素材管理 ...

  5. Vue组件模板形式实现对象数组数据循环为树形结构

    数据结构为数组中包含对象--树形结构,用Vue组件的写法实现以下的效果: 树形列表,缩进显示层级,第5级数据加底色,数据样式显色,点击展开折叠数据.本文为用Vue实现方式,另有一篇为用knockout ...

  6. 树形结构JSON的实现方法

    在Web应用程序开发领域,基于Ajax技术的JavaScript树形控件已经被广泛使用,它用来在Html页面上展现具有层次结构的数据项.目前市场上常见的JavaScript框架及组件库中均包含自己的树 ...

  7. Java实现树形结构的数据转Json格式

    在项目中难免会用到树形结构,毕竟这是一种常用的组织架构.楼主这里整理了两个实现的版本,可以直接拿来使用,非常方便. 楼主没有单独建项目,直接在以前的一个Demo上实现的.第一种,看下面代码: pack ...

  8. 使用Oracle数据库实现树形结构表的子-父级递归查询和删除,通过级联菜单简单举例

    前言: 我们在开发中,常常遇到单表的子-父id级联的表结构,在树形的深度不确定的情况下,一次查询出某个树形结构下的所有具有子-父级关系的数据变得十分困难. 这时,我们使用oracle提供的CONNEC ...

  9. 公用表表达式CTE简单递归使用-简单树形结构

    1.建表脚本 CREATE TABLE [dbo].[tb_tree]( ,) NOT NULL, [ParentId] [int] NULL, ) NULL, CONSTRAINT [PK_tb_t ...

随机推荐

  1. C/C++ Qt 运用JSON解析库 [基础篇]

    JSON是一种简单的轻量级数据交换格式,Qt库为JSON的相关操作提供了完整的类支持,使用JSON解析文件之前需要先通过TextStream流将文件读入到字符串变量内,然后再通过QJsonDocume ...

  2. 『无为则无心』Python函数 — 32、递归

    目录 1.什么叫递归函数 2.递归的应用场景 3.递归的特点 4.应用:3以内数字累加和 5.应用:阶乘 6.总结 1.什么叫递归函数 Python中,在函数内部,可以调用其他函数.如果一个函数在内部 ...

  3. ConfigParser_读取配置文件信息

    ConfigParse简介 ConfigParser 在python中是用来解析配置文件的内置模块,直接导入使用 import configparser 使用该模块可以对配置文件进行增.读.改.删操作 ...

  4. [Win32] UAC用户账户控制 (提权)

    最近写程序时遇到一个问题,就是当一个程序需要管理员权限才能正常运行该怎么办? 通过查阅多方资料,我总结出来几个比较实用的办法(每种办法实现方法不同,同时功能上也有一些小小的差异) 方法一(批处理脚本) ...

  5. Linux上天之路(十八)之自动化部署

    pexpect Pexpect 是 Don Libes 的 Expect 语言的一个 Python 实现,是一个用来启动子程序,并使用正则表达式对程序输出做出特定响应,以此实现与其自动交互的 Pyth ...

  6. 利用Javaweb应用中六种属性范围,来理解Servlet的并发问题

    注:图片如果损坏,点击文章链接:https://www.toutiao.com/i6513748225550189060/ Web应用中有六种属性范围: (1) 局部变量 (2) 实例变量 (3) 类 ...

  7. Maven自定义jar包名

    一.默认命名 <finalName>${project.artifactId}-${project.version}</finalName> 二.自定义包名 <build ...

  8. HDU分拆素数和

    https://acm.hdu.edu.cn/showproblem.php?pid=2098 时间复杂度 #include<bits/stdc++.h> using namespace ...

  9. pycharm创建脚本头文件模板

    代码头文件信息可以包括:python 解析器的位置.字符集.作者信息.创建脚本时间等,pycharm工具创建头部信息模板操作步骤如下: 设置头文件:文件-->设置-->编辑器-->文 ...

  10. Python 为什么不设计 do-while 循环结构?

    在某些编程语言中,例如 C/C++.C#.PHP.Java.JavaScript 等等,do-while 是一种基本的循环结构. 它的核心语义是:先执行一遍循环体代码,然后执行一遍条件语句,若条件语句 ...