JS实现 JSON扁平数据转换树状数据
后台我拿的数据是这样的格式:
[
{id:1 , parentId: 0, name: '', level: 0},
{id:2 , parentId: 0, name: '', level: 0},
{id:3 , parentId: 2, name: '', level: 1},
{id:4 , parentId: 2, name: '', level: 1},
{id:5 , parentId: 4, name: '', level: 2},
]
转换后的数据差不多就是这样的格式
{
[
{
id: 1,
name: ''
},
{
id: 2,
name: '',
children: [
{
id: 3
},
{
id: 4,
children: [
{
id: 5
}
]
}
]
},
]
}
js转换方式
后台获取数组 jsonData 然后转换成树状的方式
//吧后台json转换成树状形式 format(jsonData) { var result = [], temp = {}, i = 0, j = 0, len = jsonData.length for (; i < len; i++) { temp[jsonData[i]['menuId']] = jsonData[i] // 以id作为索引存储元素,可以无需遍历直接定位元素 } for (; j < len; j++) { var currentElement = jsonData[j] var tempCurrentElementParent = temp[currentElement['parentId']] // 临时变量里面的当前元素的父元素 parentId 父级ID if (tempCurrentElementParent) { // 如果存在父元素 if (!tempCurrentElementParent['children']) { // 如果父元素没有chindren键 tempCurrentElementParent['children'] = [] // 设上父元素的children键 } tempCurrentElementParent['children'].push(currentElement) // 给父元素加上当前元素作为子元素 } else { // 不存在父元素,意味着当前元素是一级元素 result.push(currentElement); } } return result; }
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· go语言实现终端里的倒计时
· 如何编写易于单元测试的代码
· 10年+ .NET Coder 心语,封装的思维:从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热?
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· 周边上新:园子的第一款马克杯温暖上架
· 分享 3 个 .NET 开源的文件压缩处理库,助力快速实现文件压缩解压功能!
· Ollama——大语言模型本地部署的极速利器
· DeepSeek如何颠覆传统软件测试?测试工程师会被淘汰吗?
· 使用C#创建一个MCP客户端