js 根据id,pid平面数据build Children树结构
数据库查出来的平面数据如下:
var nodes = [ {"id":1,"title":"第一级1","parentid":0}, {"id":2,"title":"第一级2","parentid":0}, {"id":3,"title":"第二级1-3","parentid":2}, {"id":4,"title":"第二级2-4","parentid":2}, {"id":5,"title":"第三级1-5","parentid":4}, {"id":6,"title":"第一级3","parentid":0}, {"id":7,"title":"第二级1-7","parentid":1}, {"id":8,"title":"第三级1-8","parentid":7} ];
理论上要显示出来的效果:
第一级1 --第二级1-7 --第三级1-8 第一级2 --第二级1-3 --第二级2-4 --第三级1-5 第一级3
js转换函数
function buildDataToTree(data, pid) { const result = []; let temp = []; for (let i = 0; i < data.length; i++) { if (data[i].parentid === pid) { const obj = { 'id': data[i].id, 'title': data[i].title, 'parentid': data[i].parentid,'children': [] }; temp = this.buildDataToTree(data, data[i].id); if (temp.length > 0) { obj.children = temp; } result.push(obj); } } return result; console.log("--> " + JSON.stringify(result)); }
调用:
//调用 const treeData = buildDataToTree(nodes, 0); console.log("--> " + JSON.stringify(treeData));
转换后的效果:
[{ "id": 1, "title": "第一级1", "parentid": 0, "children": [{ "id": 7, "title": "第二级1-7", "parentid": 1, "children": [{ "id": 8, "title": "第三级1-8", "parentid": 7, "children": [] }] }] }, { "id": 2, "title": "第一级2", "parentid": 0, "children": [{ "id": 3, "title": "第二级1-3", "parentid": 2, "children": [] }, { "id": 4, "title": "第二级2-4", "parentid": 2, "children": [{ "id": 5, "title": "第三级1-5", "parentid": 4, "children": [] }] }] }, { "id": 6, "title": "第一级3", "parentid": 0, "children": [] }]
作者原创文章,转载请注明出处,好用记得点赞关注不迷路
本文来自博客园,作者:IT情深,转载请注明原文链接:https://www.cnblogs.com/wh445306/p/16751758.html
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· DeepSeek 开源周回顾「GitHub 热点速览」
· 物流快递公司核心技术能力-地址解析分单基础技术分享
· .NET 10首个预览版发布:重大改进与新特性概览!
· AI与.NET技术实操系列(二):开始使用ML.NET
· 单线程的Redis速度为什么快?