当前位置: 首页 > article >正文

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

效果图:

数据源

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);
	

    // 遍历数据,构建 map
    data.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.kler.cn/a/419261.html

相关文章:

  • LabVIEW氢气纯化控制系统
  • Uniapp 使用自定义字体
  • Proxy详解
  • 与7无关的数
  • 【k8s深入理解之 Scheme 补充-1】理解 Scheme 中资源的注册以及 GVK 和 go 结构体的映射
  • 《操作系统 - 清华大学》6 -3:局部页面置换算法:最近最久未使用算法 (LRU, Least Recently Used)
  • openssl 基本命令使用方法
  • Oracle之提高PLSQL的执行性能
  • 三十二:网络爬虫的工作原理与应对方式
  • ASP网络安全讲述
  • 易速鲜花聊天客服机器人的开发(上)
  • 一体化数据安全平台uDSP 入选【年度创新安全产品 TOP10】榜单
  • Ubuntu 22.04 LTS vs Ubuntu 24.04 LTS:深度剖析,哪个版本更胜一筹?
  • ORB-SLAM2源码学习:LocalMapping.cc: LocalMapping::MapPointCulling剔除不合格的地图点
  • 使用 Docker 容器创建一个 Web 服务器:从入门到实践
  • 怎么选拔人才
  • MySQL--SQL优化
  • 私有库gitea安装
  • DRM(数字权限管理技术)防截屏录屏----ffmpeg安装
  • 图片预处理技术介绍4——降噪
  • VM+Ubuntu18.04+XSHELL+VSCode环境配置
  • 探索Scala:文本分析与文件操作的艺术
  • Ubuntu 22.04 离线安装软件包
  • PyTorch 模型转换为 ONNX 格式
  • LVS 负载均衡面试题及参考答案
  • 服务器命令行复制文件