前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >树形结构已知子节点获取子节点所有父节点——任意目录/树

树形结构已知子节点获取子节点所有父节点——任意目录/树

原创
作者头像
周陆军博客
发布2023-05-07 22:48:24
2.9K0
发布2023-05-07 22:48:24
举报
文章被收录于专栏:前端博客前端博客

JS 树形结构 根据子节点找到所有上级,比如element-tree,已知路由上的子结点id,如何回填的 展开目录树?

树的查找与遍历都非常简单,具体可以查看我之前写的:《讲透学烂二叉树(三):二叉树的遍历图解算法步骤及JS代码

或者:JS树结构操作:查找、遍历、筛选、树和列表相互转换 https://wintc.top/article/20

但是 如何根据子结点找所有父节点的目录的呢?之前的遍历与查找的代码并不能解决这个问题,这里我单独给出一段代码:

代码语言:javascript
复制
export?default?function?findParents(arr,?id,?findProps?=?'id',?childProps?=?'children')?{
??const?stock?=?[];
??let?going?=?true;
??function?recursion(arr,?id,?findProps,?childProps)?{
????arr.forEach((item)?=>?{
??????if?(!going)?return;
??????stock.push(item[findProps]);
??????if?(item[findProps]?===?id)?{
????????going?=?false;
??????}?else?if?(item[childProps])?{
????????recursion(item[childProps],?id,?findProps,?childProps);
??????}?else?{
????????stock.pop();
??????}
????});
????if?(going)??stock.pop();
??}
??recursion(arr,?id,?findProps,?childProps);
??return?stock;
}

比如:

代码语言:javascript
复制
function?findParents(arr,?id,?findProps?=?'id',?childProps?=?'children')?{
??const?stock?=?[];
??let?going?=?true;
??function?recursion(arr,?id,?findProps,?childProps)?{
????arr.forEach((item)?=>?{
??????if?(!going)?return;
??????stock.push(item[findProps]);
??????if?(item[findProps]?===?id)?{
????????going?=?false;
??????}?else?if?(item[childProps])?{
????????recursion(item[childProps],?id,?findProps,?childProps);
??????}?else?{
????????stock.pop();
??????}
????});
????if?(going)??stock.pop();
??}
??recursion(arr,?id,?findProps,?childProps);
??return?stock;
}



var?a?=?[
??{
????'id':?68,
????'space_id':?1,
????'title':?'33333',
????'folder_id':?0,
????'is_folder':?true,
????'is_default':?false,
????'build_in':?true,
????'created_by':?'andyljzhou',
????'updated_by':?'andyljzhou',
????'created_time':?'2022-04-21T11:41:09.863650Z',
????'updated_time':?'2022-04-21T11:42:56.004976Z',
????'children':?[
??????{
????????'id':?72,
????????'space_id':?1,
????????'title':?'333',
????????'folder_id':?68,
????????'is_folder':?true,
????????'is_default':?false,
????????'build_in':?true,
????????'created_by':?'andyljzhou',
????????'updated_by':?'andyljzhou',
????????'created_time':?'2022-04-21T11:58:03.376084Z',
????????'updated_time':?'2022-04-21T11:58:03.376115Z',
????????'children':?[
??????????{
??????????'id':?82,
??????????'space_id':?1,
??????????'title':?'面板',
??????????'folder_id':?72,
??????????'is_folder':?false,
??????????'is_default':?false,
??????????'build_in':?true,
??????????'created_by':?'andyljzhou',
??????????'updated_by':?'andyljzhou',
??????????'created_time':?'2022-04-22T03:36:44.364097Z',
??????????'updated_time':?'2022-04-22T03:36:44.364130Z',
??????????'children':?[]
????????}]
??????},?{
????????'id':?75,
????????'space_id':?1,
????????'title':?'222',
????????'folder_id':?68,
????????'is_folder':?true,
????????'is_default':?false,
????????'build_in':?true,
????????'created_by':?'andyljzhou',
????????'updated_by':?'andyljzhou',
????????'created_time':?'2022-04-21T12:06:48.781045Z',
????????'updated_time':?'2022-04-21T12:06:48.781077Z',
????????'children':?[]
??????}]
??}
]


console.log(findParents(a,82))

这样就可以查找满足任意前端组件 tree 的回填了

转载本站文章《树形结构已知子节点获取子节点所有父节点——任意目录/树》, 请注明出处:https://www.zhoulujun.cn/html/webfront/ECMAScript/js/2022_0422_8797.html

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
http://www.vxiaotou.com