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

server/2024/11/28 9:43:49/

效果图:

数据源

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/server/145588.html

相关文章

[java] 什么是 Apache Felix

概述 Apache Felix是一个开源的、符合OSGi&#xff08;Open Service Gateway Initiative&#xff09;R4规范的实现框架。OSGi是一个用于Java动态模块系统的一系列规范&#xff0c;而Apache Felix则是对这些规范的具体实现&#xff0c;它提供了一个轻量级的、高效的平台&#xf…

Linux操作系统2-进程控制3(进程替换,exec相关函数和系统调用)

上篇文章&#xff1a;Linux操作系统2-进程控制2(进程等待&#xff0c;waitpid系统调用&#xff0c;阻塞与非阻塞等待)-CSDN博客 本篇代码Gitee仓库&#xff1a;Linux操作系统-进程的程序替换学习 d0f7bb4 橘子真甜/linux学习 - Gitee.com 本篇重点&#xff1a;进程替换 目录 …

HarmonyOS开发者社区有奖征文二期活动开启!

HarmonyOS开发者社区有奖征文活动第二期如约而至&#xff01;在上一期的基础上&#xff0c;我们精心策划了更多样化的主题&#xff0c;旨在为开发者们提供一个更广阔的交流平台。无论您是想探讨HarmonyOS的技术细节&#xff0c;还是分享您的开发经验&#xff0c;或是记录您与Ha…

解决发布web接口时数据无法JSON化的问题

解决HTTP接口传输中的JSON序列化问题 引言 当涉及到复杂的数据类型时&#xff0c;如浮点数、Numpy数组、pandas等&#xff0c;直接使用Python的json模块进行序列化可能会遇到问题。本文将解决这些问题&#xff0c;并提供一个通用的方案&#xff0c;确保数据能够顺利地通过HTT…

d3-contour 生成等高线图

D3.js 是一个强大的 JavaScript 库&#xff0c;用于创建动态、交互式数据可视化。d3-contour 是 D3.js 的一个扩展模块&#xff0c;用于生成等高线图&#xff08;contour plots&#xff09;。 属性和方法 属性 x: 一个函数&#xff0c;用于从数据点中提取 x 坐标。y: 一个函…

Kubernetes 分布式存储后端:指南

在 Kubernetes 中实现分布式存储后端对于管理跨集群的持久数据、确保高可用性、可扩展性和可靠性至关重要。在 Kubernetes 环境中&#xff0c;应用程序通常被容器化并跨多个节点部署。虽然 Kubernetes 可以有效处理无状态应用程序&#xff0c;但有状态应用程序需要持久存储来维…

【算法day1】数组:双指针算法

题目引用 这里以 1、LeetCode704.二分查找 2、LeetCode27.移除元素 3、LeetCode977.有序数组的平方 这三道题举例来说明数组中双指针的妙用。 1、二分查找 给定一个 n 个元素有序的&#xff08;升序&#xff09;整型数组 nums 和一个目标值 target &#xff0c;写一个函数搜…

创建可重用React组件的实用指南

尽管React是全球最受欢迎和使用最广泛的前端框架之一&#xff0c;但许多开发者在重构代码以提高可复用性时仍然感到困难。如果你发现自己在React应用中不断重复相同的代码片段&#xff0c;那你来对地方了。 在本教程中&#xff0c;将向你介绍三个最常见的特征&#xff0c;表明是…