扁平化数据转树形结构 tree

8 篇文章 0 订阅
2 篇文章 0 订阅

扁平化数据转树形结构

			let {
				list
			} = {
				"msg": "success",
				"code": 200,
				"list": [{
					"id": "1",
					"code": "1",
					"pCode": "0",
					"name": "工业经济发展",
					"fullName": "工业经济发展",
				}, {
					"id": "1-1",

					"code": "1-1",
					"pCode": "1",
					"name": "总体规模",
					"fullName": "工业经济发展-总体规模",

				}, {
					"id": "1-1-1",

					"code": "1-1-1",
					"pCode": "1-1",
					"name": "工业总量",
					"fullName": "工业经济发展-总体规模-工业总量",

				}, {
					"id": "1-2",

					"code": "1-2",
					"pCode": "1",
					"name": "创新发展",
					"fullName": "工业经济发展-创新发展",

				}, {
					"id": "1-2-1",

					"code": "1-2-1",
					"pCode": "1-2",
					"name": "专精特新企业",
					"fullName": "工业经济发展-创新发展-专精特新企业",

				}, {
					"id": "1-3",

					"code": "1-3",
					"pCode": "1",
					"name": "数智赋能",
					"fullName": "工业经济发展-数智赋能",

				}, {
					"id": "1-3-1",

					"code": "1-3-1",
					"pCode": "1-3",
					"name": "工业互联网试点示范",
					"fullName": "工业经济发展-数智赋能-工业互联网试点示范",

				}, {
					"id": "1-4",

					"code": "1-4",
					"pCode": "1",
					"name": "开放合作",
					"fullName": "工业经济发展-开放合作",

				}, {
					"id": "1-4-1",

					"code": "1-4-1",
					"pCode": "1-4",
					"name": "新增外资项目",
					"fullName": "工业经济发展-开放合作-新增外资项目",

				}, {
					"id": "1-5",
					"code": "1-5",
					"pCode": "1",
					"name": "绿色发展",
					"fullName": "工业经济发展-绿色发展",
				}, {
					"id": "1-5-1",
					"code": "1-5-1",
					"pCode": "1-5",
					"name": "六大高耗能行业能耗情况",
					"fullName": "工业经济发展-绿色发展-六大高耗能行业能耗情况",
				}]
			}
	/**
			 * 转树形结构
			 * @param {*} list 偏平数据源
			 * @param {*} id 子节点指定字段
			 * @param {*} pid 父节点指定字段
			 * @param {*} lable  指定显示名称
			 * 
			 */
			const treeDate = (list, id, pid = 0, lable = 'name') => {
				let treeList = list.reduce((pre, cur) => {
					pre[cur[id]] = cur;
					return pre
				}, {})
				let result = list.reduce((prev, cur) => {
					let parentId = cur[pid];
					// 拓展属性 适配element组件或其它UI组件
					cur.lable = cur[lable]
					cur.value = cur.id
					// pid为0的就找不到父对象,找到当前cur的父对象
					// 对象的浅拷贝,引用关系存在,在后面处理parent的时候也会导致cur的改变,达到递归的效果
					let parent = treeList[parentId]
					// 如果父对象存在,就将cur压到父对象的children属性中
					if (parent) {
						// parent和cur存在引用关系
						parent.children ? parent.children.push(cur) : parent.children = [cur]
					} else if (parentId === '0') {
						// 则此cur为树的根元素
						prev.push(cur)
					}
					return prev
				}, [])
				return result
			}
			const resultTree = treeDate(arr, 'code', 'pCode')
			console.log(resultTree)
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值