// 封装转化树方法
// 思路
// 1. 方法的参数是什么 返回值是什么 - 参数平铺的数组 返回值树形数组
// 2. 数据处理逻辑(时间复杂度最小的写法)
// 核心处理思路:
// 寻找父节点的过程 通过pid字段去匹配id字段 如果能找到就把当前项放到父节点的children
// 属性里,如果找不到父节点,它自己本身就是最外层的节点 直接放到最终产出的数组中
// 代码逻辑:
// 1. 遍历要处理的数组 把数组中每一项的id作为key,对象本身作为value形成一个map对象结构
// 2. 遍历要处理的数组 通过pid去第一步中形成的对象里寻找id进行匹配,如果匹配的上,就push到chilren属性里
// 如果匹配不上,就把当前项 push到最终产出的数组中
function transTree(arr) {
const targetArr = []
// 进行数据处理 todo
// 1.形成map对象结构
const map = {}
arr.forEach(item => {
map[item.id] = item
map[item.id].children = []
})
// 通过pid进行匹配
arr.forEach(item => {
if (map[item.pid]) {
map[item.pid].children.push(item)
} else {
targetArr.push(item)
}
})
return targetArr
}
export default transTree
将扁平数组转化为树状数组
原创
©著作权归作者所有:来自51CTO博客作者晨曦前端的原创作品,请联系作者获取转载授权,否则将追究法律责任
将扁平数组转化为树状数组
https://blog.51cto.com/u_15473285/5388082
将扁平数组转化为树状数组
https://blog.51cto.com/u_15473285/5388082
上一篇:vue指令学习
下一篇:嵌套块元素外边距塌陷问题解决方法
举报文章
请选择举报类型
内容侵权
涉嫌营销
内容抄袭
违法信息
其他
补充说明
0/200
上传截图
格式支持JPEG/PNG/JPG,图片不超过1.9M

提问和评论都可以,用心的回复会被更多人看到
评论
发布评论
相关文章
-
数组扁平化&对象扁平化
1.数组扁平化1.1 toString+split1.2 reduce1.3 join+split1.4 递归+循环1.5 扩展运算符1.6 flat()2.对象扁平化
JavaScript js 数组扁平化 对象扁平化 数组 -
js一维数组转化成树结构
一循环数组*二对比字节pid*三递归数组与父id*四赋值数组
javascript 数组 递归 赋值 -
树状数组详解
引用请注明
树状数组 数组 复杂度 -
扁平化数组的几种方法(将多为数组转换成一维数组)
flat4中+item是将字符串数组转换为数字数组。
字符串数组 数组 i++ mysql -
多维数组扁平化处理
数组扁平化:就是把多层嵌套的数组中的内容取出,变成一维的数组就像[1,2,3,[4,5],[6,7,[8,9]],10,11]处理成
javascript 数组 扁平化 递归