JS----前端将列表数据转树型数据

前端将列表数据转树型数据

场景:后端返回列表数据,由前端根据业务需求完成树型数据转换,

常用于侧边导航菜单,下拉树型数据项等

js 复制代码
export function listToTree(data: []) {
	var map: any = {},
		tree: any = []

	data.forEach((item: any) => {
		delete item?.children
		delete item?.params

		if (!item.label) {
			item.label = item?.name ?? item?.title
		}
		if (!item.value) {
			item.value = item?.id
		}

		map[item?.id] = item
	})

	/**
	 * 以原数据量循环拼装父,子级
	 */
	data.forEach((item: any) => {
		var parent = map[item?.pid]
		if (parent) {
			(parent.children || (parent.children = [])).push(item)
		} else {
			tree.push(item)
		}
	})

	return tree
}

如:菜单

相关推荐
一晌贪欢i3 分钟前
WebContainer 重点介绍
前端·webcontainer
山河木马5 分钟前
Emscripten 从 C/C++ 调用 JavaScript
前端·javascript·c++
鹏程十八少20 分钟前
12. Android 协程通关秘籍:31 道资深工程师面试题精讲
前端·后端·面试
Dlrb121132 分钟前
C语言-字符串指针与函数指针
java·c语言·前端
PBitW37 分钟前
组件封装注意事项
前端·vue.js
weiggle42 分钟前
Android 输入事件分发流程:从物理触控到 Activity 的完整旅程
前端
yingyima1 小时前
开发者必备在线工具集合 2025:实战案例解析
前端
前端毕业班1 小时前
面试官:实现一个带类型约束的 EventEmitter
前端·面试
卷帘依旧1 小时前
SPA 中的 Hash 和 History 模式
前端
用户4445543654261 小时前
AndroidAutoSize使用时遇到的特麻烦bug
前端