转化轮询数据成树状结构

2024-08-21 20:04

本文主要是介绍转化轮询数据成树状结构,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

写个方法转化轮询数据成树状结构

const data = [{"URI": "","PathName": "1.txt","Reason": "","IsFolder": false,"PackedSize": "0","UnPackedSize": "0","FileAccessTime": "2024-08-15T09:21:44Z"},{"URI": "","PathName": "2.txt","Reason": "","IsFolder": false,"PackedSize": "0","UnPackedSize": "0","FileAccessTime": "2024-08-15T09:21:44Z"},{"URI": "","PathName": "测试1/","Reason": "","IsFolder": true,"PackedSize": "0","UnPackedSize": "0","FileAccessTime": "2024-08-15T09:21:44Z"},{"URI": "","PathName": "测试1/333.txt","Reason": "","IsFolder": false,"PackedSize": "0","UnPackedSize": "0","FileAccessTime": "2024-08-15T09:21:44Z"},{"URI": "","PathName": "测试1/冲冲冲","Reason": "","IsFolder": true,"PackedSize": "0","UnPackedSize": "0","FileAccessTime": "2024-08-15T09:21:44Z"},{"URI": "","PathName": "测试1/冲冲冲/555.txt","Reason": "","IsFolder": false,"PackedSize": "0","UnPackedSize": "0","FileAccessTime": "2024-08-15T09:21:44Z"},{"URI": "","PathName": "测试2/","Reason": "","IsFolder": true,"PackedSize": "0","UnPackedSize": "0","FileAccessTime": "2024-08-15T09:21:44Z"},{"URI": "","PathName": "测试2/444.txt","Reason": "","IsFolder": false,"PackedSize": "0","UnPackedSize": "0","FileAccessTime": "2024-08-15T09:21:44Z"}
]const renderTree = (data) => {let TREE = []let temp = []data.forEach((item) => {let arr = item.PathName.split('/').filter(i => i)if (arr.length === 1) {item.label = item.PathName.replace(/\//, '')TREE.push({...item, children: []})} else {temp.push(item)}})const changeTreeData =  (TREE, TREE2) => {for (let i = 0; i < TREE.length; i++) {for (let j = 0; j < TREE2.length; j++) {let str = TREE2[j].PathName.split('/').filter(i => i)if (TREE[i].PathName.split('/')[0] === str[0] && str.length === 2) {let a = stra.shift()TREE2[j].PathName = a.join('')TREE2[j].label = a.join('')TREE[i].children.push({...TREE2[j], children: []})} else if (TREE[i].PathName.split('/')[0] === str[0]) {let a = stra.shift()TREE2[j].PathName = a.join('/')changeTreeData(TREE[i].children, [TREE2[j]])}}}}changeTreeData(TREE, temp)return TREE
}
console.log(renderTree(data))

这篇关于转化轮询数据成树状结构的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1094142

相关文章

MySQL 删除数据详解(最新整理)

《MySQL删除数据详解(最新整理)》:本文主要介绍MySQL删除数据的相关知识,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧... 目录一、前言二、mysql 中的三种删除方式1.DELETE语句✅ 基本语法: 示例:2.TRUNCATE语句✅ 基本语

MyBatisPlus如何优化千万级数据的CRUD

《MyBatisPlus如何优化千万级数据的CRUD》最近负责的一个项目,数据库表量级破千万,每次执行CRUD都像走钢丝,稍有不慎就引起数据库报警,本文就结合这个项目的实战经验,聊聊MyBatisPl... 目录背景一、MyBATis Plus 简介二、千万级数据的挑战三、优化 CRUD 的关键策略1. 查

python实现对数据公钥加密与私钥解密

《python实现对数据公钥加密与私钥解密》这篇文章主要为大家详细介绍了如何使用python实现对数据公钥加密与私钥解密,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下... 目录公钥私钥的生成使用公钥加密使用私钥解密公钥私钥的生成这一部分,使用python生成公钥与私钥,然后保存在两个文

mysql中的数据目录用法及说明

《mysql中的数据目录用法及说明》:本文主要介绍mysql中的数据目录用法及说明,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录1、背景2、版本3、数据目录4、总结1、背景安装mysql之后,在安装目录下会有一个data目录,我们创建的数据库、创建的表、插入的

Navicat数据表的数据添加,删除及使用sql完成数据的添加过程

《Navicat数据表的数据添加,删除及使用sql完成数据的添加过程》:本文主要介绍Navicat数据表的数据添加,删除及使用sql完成数据的添加过程,具有很好的参考价值,希望对大家有所帮助,如有... 目录Navicat数据表数据添加,删除及使用sql完成数据添加选中操作的表则出现如下界面,查看左下角从左

MySQL中的索引结构和分类实战案例详解

《MySQL中的索引结构和分类实战案例详解》本文详解MySQL索引结构与分类,涵盖B树、B+树、哈希及全文索引,分析其原理与优劣势,并结合实战案例探讨创建、管理及优化技巧,助力提升查询性能,感兴趣的朋... 目录一、索引概述1.1 索引的定义与作用1.2 索引的基本原理二、索引结构详解2.1 B树索引2.2

SpringBoot中4种数据水平分片策略

《SpringBoot中4种数据水平分片策略》数据水平分片作为一种水平扩展策略,通过将数据分散到多个物理节点上,有效解决了存储容量和性能瓶颈问题,下面小编就来和大家分享4种数据分片策略吧... 目录一、前言二、哈希分片2.1 原理2.2 SpringBoot实现2.3 优缺点分析2.4 适用场景三、范围分片

如何使用Maven创建web目录结构

《如何使用Maven创建web目录结构》:本文主要介绍如何使用Maven创建web目录结构的问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录创建web工程第一步第二步第三步第四步第五步第六步第七步总结创建web工程第一步js通过Maven骨架创pytho

Redis分片集群、数据读写规则问题小结

《Redis分片集群、数据读写规则问题小结》本文介绍了Redis分片集群的原理,通过数据分片和哈希槽机制解决单机内存限制与写瓶颈问题,实现分布式存储和高并发处理,但存在通信开销大、维护复杂及对事务支持... 目录一、分片集群解android决的问题二、分片集群图解 分片集群特征如何解决的上述问题?(与哨兵模

Python循环结构全面解析

《Python循环结构全面解析》循环中的代码会执行特定的次数,或者是执行到特定条件成立时结束循环,或者是针对某一集合中的所有项目都执行一次,这篇文章给大家介绍Python循环结构解析,感兴趣的朋友跟随... 目录for-in循环while循环循环控制语句break语句continue语句else子句嵌套的循