关于平级Arrlist更改为树形Arrlist

本文介绍了如何使用JavaScript对数据进行深度拷贝,并通过filter方法实现节点的层级关系整理。重点展示了`populateChildren`函数,用于处理数据上下级关系变化,以及`populateLevel`函数对树形结构的层级测量。
摘要由CSDN通过智能技术生成
  • 单纯的取数据

treeData(data){
	let cloneData = JSON.parse(JSON.stringify(data)) //对源数据深拷贝
	return cloneData.filter(father => {
		let branchArr = cloneData.filter(children => father.id === 	children.fatherId //返回每一项的子级数据
		if (branchArr.length > 0) {
			father.children = branchArr //如果存在子级,则给父级增加一个children属性并赋值
		} 
		return father.fatherId === null //返回第一层
	}) 
}
  • 数据可能进行上下级更改

export function populateChildren (nodes) {
  if (!nodes) return {}
  Object.values(nodes).forEach(v => {
    if (!v.children) v.children = [] //不存在子级将其置空
    if (v.parentId && nodes[v.parentId]) {
      const parentNode = nodes[v.parentId]
      if (!parentNode.children) parentNode.children = []
      parentNode.children.push(v.id)
    }
  })
  const topParents = Object.values(nodes).filter(n => !n.parentId) //找到每棵树的树顶
  topParents.forEach(t => populateLevel(t, nodes)) //调用populateLevel方法对树的等级进行测量
  return nodes
}

function populateLevel (node, nodes) {
  if (!node.parentId) {
    node.level = 0
  }
  if (node.children && node.children.length) {
    node.children.forEach(nodeId => {
      const n = nodes[nodeId]
      n.level = node.level + 1
      populateLevel(n, nodes)
    })
  }
}
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值