树结构的数据下 js递归实现方式改变数据
数据结构:
let data = [ { "id": 301, "name": "运营部门", "parentId": 300, "code": "op", "status": 0, "des": null, "children": [ { "id": 302, "name": "运营部门-a", "parentId": 301, "code": "op-a", "status": 0, "des": null, "children": [] }, { "id": 110744, "name": "111", "parentId": 301, "code": "iw3hJiCl", "status": 1, "des": null, "children": [] } ] }, { "id": 303, "name": "测试部门", "parentId": 300, "code": "qa", "status": 0, "des": null, "children": [] }, { "id": 110740, "name": "技术部门", "parentId": 300, "code": "tXAHHG0P", "status": 1, "des": "aaa", "children": [ { "id": 110745, "name": "组织部门", "parentId": 110740, "code": "YZQCJRAc", "status": 1, "des": null, "children": [] } ] }, { "id": 110741, "name": "产品部门", "parentId": 300, "code": "DsoEPMcO", "status": 1, "des": null, "children": [ { "id": 110746, "name": "产品线13", "parentId": 110741, "code": "Ugs4F0tq", "status": 1, "des": null, "children": [ { "id": 110747, "name": "产品线2", "parentId": 110746, "code": "KOXbSIVj", "status": 1, "des": null, "children": [] } ] } ] }, { "id": 110743, "name": "运营部门-b", "parentId": 300, "code": "UXn7nG7o", "status": 1, "des": null, "children": [] } ]
实现效果1:里面的id改为key,name改成title,children还是保持原来的,其他所有的属性都不要
const handleData = (data) =>{ let arry = []; data.forEach((v, k) => { let obj = {}; obj.title = data[k].name; obj.key = data[k].id; obj.children = data[k].children; arry.push(obj); if(v.children){ handleData(v.children) } }) return arry }; handleData(data);
实现效果2:里面的新增属性key值为原来的id值,新增属性name值为原来的title值
const handleData = (data) =>{ data.forEach((v, k) => { v.title = data[k].name; v.key = data[k].id; if(v.children){ handleData(v.children) } }) }; handleData(data);
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· winform 绘制太阳,地球,月球 运作规律
· 超详细:普通电脑也行Windows部署deepseek R1训练数据并当服务器共享给他人
· TypeScript + Deepseek 打造卜卦网站:技术与玄学的结合
· AI 智能体引爆开源社区「GitHub 热点速览」
· 写一个简单的SQL生成工具
2020-05-19 前端js倒计时(精确到毫秒)