处理后台<平铺数据>,转换为<树形数据>

处理后台平铺数据,变成树形数据

后台发来的数据是一级的数组对象
我们在做树状图是需要树形结构数据
用children存储二级数据
如:

arr=[
 	  {id:"01", pid:"",   "name":"老王" },
 	  {id:"02", pid:"01", "name":"小张" }
  ]

上面的结构说明: 老王是小张的上级
实现后结构:

 arr=[
	  {id:"01", pid:"", "name":"老王",children:[
	 	  {id:"02", pid:"01", "name":"小张" }
	   ] },
 ]
/**
 * 把平铺的数组变成树状的数组的函数
 */
 function tranListToTreeData(arr) {
  const treeArr = []
  const map = {}
    // 遍历出得到以id为属性名,这个id的全部信息为属性值的数组对象,
    //方便后面遍历出pid来与id进行比较 存储数据 
    // 给所有的id都添加一个children属性名

  arr.forEach(item => {
    item.children = []
    map[item.id] = item
  })
    // 再次遍历来将pid拿出来,如果有pid就是有上级,
    //就会被加入到pid=id的那个领导的children中,
    //否则就是一级,直接推进准备好的treeList数组

  arr.forEach(item => {
    const pItem = map[item.pid]
    if (pItem) {
      pItem.children.push(item)
    } else {
      treeArr.push(item)
    }
  })
  return treeArr
}

在这里插入图片描述

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

打赏作者

一个大萝北

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

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

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

打赏作者

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

抵扣说明:

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

余额充值