根据后台数据结构,构建搜索目录树

news/2024/12/3 3:09:52/

效果图:

数据源

const data = [{"categoryidf": "761525000288210944","categoryids": "766314364226637824","menunamef": "经济运行","menunames": "经济运行总览","tempname": "南沙区XXXX年XX季度经济运行情况及存在问题","tempid": "787314277060055040","show_orderf": 2,"show_orderss": 1},{"categoryidf": "761525000288210944","categoryids": "766314364226637824","menunamef": "经济运行","menunames": "经济运行总览","tempname": "报告模板","tempid": "805483785230618624","show_orderf": 2,"show_orderss": 1},{"categoryidf": "761525000288210944","categoryids": "766314364226637824","menunamef": "经济运行","menunames": "经济运行总览","tempname": "南沙区经济运行分析报告-开发中勿删","tempid": "766692223369744384","show_orderf": 2,"show_orderss": 1},{"categoryidf": "761560904969097216","categoryids": "787329448503545856","menunamef": "宏观经济","menunames": "地区生产总值","tempname": null,"tempid": null,"show_orderf": 3,"show_orderss": 1},{"categoryidf": "761560904969097216","categoryids": "787329962872016896","menunamef": "宏观经济","menunames": "行业总览","tempname": null,"tempid": null,"show_orderf": 3,"show_orderss": 2},{"categoryidf": "761560904969097216","categoryids": "787330410567831552","menunamef": "宏观经济","menunames": "工业","tempname": null,"tempid": null,"show_orderf": 3,"show_orderss": 3},{"categoryidf": "761560904969097216","categoryids": "787330779163267072","menunamef": "宏观经济","menunames": "商贸业","tempname": null,"tempid": null,"show_orderf": 3,"show_orderss": 4},{"categoryidf": "761560904969097216","categoryids": "787331288074948608","menunamef": "宏观经济","menunames": "服务业","tempname": null,"tempid": null,"show_orderf": 3,"show_orderss": 5},{"categoryidf": "761560904969097216","categoryids": "787331500218650624","menunamef": "宏观经济","menunames": "房地产开发业","tempname": null,"tempid": null,"show_orderf": 3,"show_orderss": 6},{"categoryidf": "761560904969097216","categoryids": "787331766636646400","menunamef": "宏观经济","menunames": "建筑业","tempname": null,"tempid": null,"show_orderf": 3,"show_orderss": 7},{"categoryidf": "761560904969097216","categoryids": "787332016487141376","menunamef": "宏观经济","menunames": "进出口","tempname": null,"tempid": null,"show_orderf": 3,"show_orderss": 8},{"categoryidf": "761560904969097216","categoryids": "787332232145670144","menunamef": "宏观经济","menunames": "固定资产投资","tempname": null,"tempid": null,"show_orderf": 3,"show_orderss": 9},{"categoryidf": "761560904969097216","categoryids": "787332439809855488","menunamef": "宏观经济","menunames": "派生产业","tempname": null,"tempid": null,"show_orderf": 3,"show_orderss": 10},{"categoryidf": "767696419078410240","categoryids": null,"menunamef": "营商环境","menunames": null,"tempname": null,"tempid": null,"show_orderf": 4,"show_orderss": 0},{"categoryidf": "763705116242087936","categoryids": null,"menunamef": "数字经济","menunames": null,"tempname": null,"tempid": null,"show_orderf": 5,"show_orderss": 0},{"categoryidf": "763705094125522944","categoryids": "787332966232756224","menunamef": "产业经济","menunames": "产业总览","tempname": null,"tempid": null,"show_orderf": 5,"show_orderss": 1},{"categoryidf": "763705094125522944","categoryids": "807545774656327680","menunamef": "产业经济","menunames": "产业链图谱","tempname": "系列产业研究报告标准版本","tempid": "807546080970543104","show_orderf": 5,"show_orderss": 2},{"categoryidf": "763705094125522944","categoryids": "787333327861452800","menunamef": "产业经济","menunames": "人才和创新资源","tempname": null,"tempid": null,"show_orderf": 5,"show_orderss": 3},{"categoryidf": "767696724260163584","categoryids": null,"menunamef": "企业发展","menunames": null,"tempname": null,"tempid": null,"show_orderf": 6,"show_orderss": 0},{"categoryidf": "767696857580310528","categoryids": "777906003562860544","menunamef": "智慧招商","menunames": "演示","tempname": "南沙区经济运行分析报告-演示使用勿删","tempid": "777906168692609024","show_orderf": 7,"show_orderss": 2},{"categoryidf": "786523422359425024","categoryids": null,"menunamef": "经济韧性评估","menunames": null,"tempname": null,"tempid": null,"show_orderf": 8,"show_orderss": 0}]

转换为树目录结构

// 定义一个函数来构建层级结构
function buildHierarchy(data: any[]): any[]{const hierarchy: any[] = [];const map = new Map<string, any>();console.log('map',map);// 遍历数据,构建 mapdata.forEach(item => {if (!map.has(item.menunamef)) {map.set(item.menunamef, {key:item.categoryidf,label: item.menunamef,children: []});hierarchy.push(map.get(item.menunamef));}if (item.menunames) {const parent = map.get(item.menunamef);if (!parent.children.find(child => child.label === item.menunames)) {parent.children.push({key:item.categoryids,label: item.menunames,children: []});}}if (item.tempname) {const parent = map.get(item.menunamef);const subParent = parent.children.find(child => child.label === item.menunames);if (subParent) {subParent.children.push({label: item.tempname,key: item.tempid});} else {parent.children.push({label: item.tempname,key: item.tempid});}}});return hierarchy;
}const result = buildHierarchy(data);


http://www.ppmy.cn/news/1551904.html

相关文章

[Go] slice切片详解

切片详解 切片的实现 Go 中的切片本质上是一个结构体&#xff0c;包含以下三个部分&#xff1a; 指向底层数组的指针&#xff08;array&#xff09;&#xff1a;切片指向一个底层数组&#xff0c;数组中存储着切片的数据。切片的长度&#xff08;len&#xff09;&#xff1a…

通信原理实验:PCM编译码

目录 一、实验目的和要求 二、实验内容和原理 实验器材 实验原理 实验原理框图 实验框图说明 三、实验步骤 实验项目二 PCM 编码规则验证 四、实验记录与处理(数据、图表、计算等) 五、实验结果及分析 一、实验目的和要求 掌握脉冲编码调制与解调的原理。掌握脉冲编…

百度 文心一言 vs 阿里 通义千问 哪个好?

背景介绍&#xff1a; 在当前的人工智能领域&#xff0c;随着大模型技术的快速发展&#xff0c;市场上涌现出了众多的大规模语言模型。然而&#xff0c;由于缺乏统一且权威的评估标准&#xff0c;很多关于这些模型能力的文章往往基于主观测试或自行设定的排行榜来评价模型性能…

手机卡限速丨中国移动5G变3G,网速500kb

以下猜测错误&#xff0c;又有新的猜测&#xff1a;河南移动的卡出省限速。可能是因为流量结算。 “2024年7月1日起&#xff0c;中国移动集团内部将开启跨省流量结算” 在深圳四五年了&#xff0c;之前没有过&#xff0c;就从上个月开始。 中国移动会自动把近期使用流量较少…

安装SQL Server 2022提示需要Microsoft .NET Framework 4.7.2 或更高版本

安装SQL Server 2022提示需要Microsoft .NET Framework 4.7.2 或更高版本。 原因是&#xff1a;当前操作系统版本为Windows Server 2016 Standard版本&#xff0c;其自带的Microsoft .NET Framework 版本为4.6太低&#xff0c;不满足要求。 根据报错的提示&#xff0c;点击链接…

el-selet下拉菜单自定义内容,下拉内容样式类似表格

<el-form-item label"角色:" prop"username"><el-selectv-model"value"placeholder"Select"popper-class"role_select"><el-option disabled><div class"flex"><div style"width…

40分钟学 Go 语言高并发:pprof性能分析工具详解

pprof性能分析工具详解 一、知识要点概述 分析类型主要功能使用场景重要程度CPU分析分析CPU使用情况和热点函数性能优化、CPU密集型任务分析⭐⭐⭐⭐⭐内存分析分析内存分配和泄漏问题内存优化、泄漏排查⭐⭐⭐⭐⭐协程分析分析goroutine的创建和阻塞并发问题排查、死锁分析⭐…

微积分复习笔记 Calculus Volume 2 - 3.1 Integration by Parts

The first 2 chapters of volume 2 are the same as those in volume 1. Started with Chapter 3. 3.1 Integration by Parts - Calculus Volume 2 | OpenStax