ele UI 的树级菜单的数据要求是这种嵌套的,但是Ztree的老用发的是

var zNodes =[
{ id:, pId:, name:"zTree Home", pid:0},
{ id:, pId:, name:"zTree in Google",pid:0},
       { id:, pId:, name:"zTree in Iteye",pid:1}]

这种以pid来识别父级关系的,话不多说转换

  //将数组转成嵌套的
buildTree (arr) {
let temp = {}
let tree = {}
// 数组转 键值对
arr.forEach(item => {
temp[item.id] = item
}) let tempKeys = Object.keys(temp)
tempKeys.forEach(key => {
// 获取当前项
let item = temp[key]
// 当前项 pId
let _itemPId = item.pid
// 获取父级项
let parentItemByPid = temp[_itemPId]
if (parentItemByPid) {
if (!parentItemByPid.children) {
parentItemByPid.children = []
}
parentItemByPid.children.push(item)
} else {
tree[item.id] = item
}
})
// 对象转数组并返回
return Object.keys(tree).map(key => tree[key])
},

!!!

JS 将json数组转为嵌套层级数组的更多相关文章

  1. js 中 json.stringfy()将对象、数组转换成字符串

    json.stringfy()将对象.数组转换成字符串 var student = new Object(); student.name = "Lanny"; student.ag ...

  2. C# json提取多层嵌套到数组-- C# json 数组

    json比一般格式再复杂点的就像数组一样,有多层嵌套,研究了一下,记录代码如下: string jsonText = "{'name':'test','phone':'18888888888 ...

  3. C# json提取多层嵌套到数组

    string jsonText = "{'name':'test','phone':'18888888888','image':[{'name':'img1','data':'data1'} ...

  4. js 把json字符串转为json对象

       <input type="hidden" name="data" id="data" value='[{"name&q ...

  5. 字符串数组转为PHP级数组

    先要把字符串处理一下,成为php定义数组的形式,再用eval执行: $str="Array([15] => Array([id] => 2304[fromtype] => ...

  6. 使用js把json字符串转为js对象的方法

    ECMA-262(E3) 中没有将JSON概念写到标准中,还好在 ECMA-262(E5)中JSON的概念被正式引入了,包括全局的JSON对象和Date的toJSON方法. 1,eval方式解析,恐怕 ...

  7. JS中将json字符串转为json对象的三种方式

    第一种:利用JSON的parse方法,即jsonObj=JSON.parse(jsonStr); 第二种:jsonObj = eval('(' + jsonStr+ ')'); 第三种:比较难理解:j ...

  8. array_column() 函数[二维数组转为一维数组]

    array_column() 函数 输出数组中某个键值的集合[二维数组转为一位数组] <?php // 表示由数据库返回的可能记录集的数组 $a = array( array( 'id' =&g ...

  9. 用递归将嵌套的JSON对象遍历出来,转为二维数组

    如题所示,代码如下: var arJsonNesting = [{id:1,name:"zhang3" ,children:[{id:2,name:"zhang33&qu ...

随机推荐

  1. Linux:安装Ubuntu时出现“客户机操作新系统已禁用CPU,请关闭或重置虚拟机”

    安装Ubuntu时出现“客户机操作新系统已禁用CPU,请关闭或重置虚拟机“ 解决 在vmware的虚拟机的配置文件中找到xxxx.vmx的文件 用记事本打开 加入 cpuid..eax = " ...

  2. Java第六次作业--异常处理和Java类集

    Deadline: 2017-5-4 23:00 一.学习要点 认真看书并查阅相关资料,掌握以下内容: 理解Java的异常处理机制 掌握捕获异常和声明抛出异常的方法 掌握List接口的实现类Array ...

  3. Python selenium chrome 环境配置

    Python selenium chrome 环境配置 一.参考文章: 1. 记录一下python easy_install和pip安装地址和方法 http://heipark.iteye.com/b ...

  4. Armadillo安装及使用

    以下转载自http://www.cnblogs.com/youthlion/archive/2012/05/15/2501465.html Armadillo是一个C++开发的线性代数库,在vs201 ...

  5. 【java多线程】java的线程池分析

    (一)线程池的拒绝策略 --->拒绝策略的接口java.util.concurrent.RejectedExecutionHandler --->终止策略(默认):java.util.co ...

  6. 为已编译的DLL附带强命名

    在我们开发的过程中,会经常调用其他人写好的DLL类库,由于种种的原因,不管是公司规定,还是个人习惯等等的原因,有时候需要调用各个类库直接邀请必须强命名. 但是我们临时也无法找到源代码进行重新编译等事情 ...

  7. web应用中的Filter过滤器之基础概述

    1 过滤器概述 当web容器接收到对一个资源的请求时,它将判断是否有过滤器与这个资源相关联,如果有,那么容器将把这个请求交给过滤器进行处理.在过滤器中,你可以改变请求的内容或者重新设置请求的报头信息, ...

  8. 自动获取 LDAP 基准 DN 列表

    问题描述 在使用 LDAP 协议从 Active Directory 等目录管理服务获取组织结构数据时,一般总是需要对目录的检索路径进行配置.但是由于实际使用中的目录组织结构通常会比较复杂,往往会出现 ...

  9. 代码规范 for node.js with 'npm-coding-style'

    npm-coding-style npm's "funny" coding style Description npm's coding style is a bit unconv ...

  10. wamp 配置多站点访问

    1:在f:\wamp\bin\apache\apache2.2.21\conf目录下打开 httpd.conf 查找到 #include conf/extra/httpd-vhosts.conf 把前 ...