js 数组转tree格式数据

1. 数据

let arr = [{
				id: 1,
				name: '部门1',
				pid: 0
			},
			{
				id: 2,
				name: '部门2',
				pid: 1
			},
			{
				id: 3,
				name: '部门3',
				pid: 1
			},
			{
				id: 4,
				name: '部门4',
				pid: 3
			},
			{
				id: 5,
				name: '部门5',
				pid: 4
			},
			{
				id: 6,
				name: '部门6',
				pid: 100
			},
		]

2. 递归方法

/**
		 * 递归查找,获取children
		 */
		const getChildren = (data, result, pid) => {
			data.forEach(item => {
				//如果元素的pid 和要查找的pid一致, 生成children格式数据存入结果数据
				if (item.pid === pid) {
					const newItem = {
						...item,
						children: []
					};
					result.push(newItem);
					//查每一个数据的子集
					getChildren(data, newItem.children, item.id);
				}
			})
		}

		/**
		 * 转换方法
		 */
		const arrayToTreeRecursive = (data, pid) => {
			const result = [];
			getChildren(data, result, pid)
			return result;
		}

		let res = arrayToTreeRecursive(arr, 0)
		console.log(res)

3. 遍历方法

function arrayToTree(arr) {
			const result = []; // 存放结果集
			const itemMap = {}; // 键是id 值是children对象的数据

			// 先转成map存储,键是id
			for (const item of arr) {
				itemMap[item.id] = {
					...item,
					children: []
				}
			}

			for (const item of arr) {
				const id = item.id;
				const pid = item.pid;
				const treeItem = itemMap[id]; //每一个数据
				//如果是第一层数据,直接push 到结果数据
				if (pid === 0) {
					result.push(treeItem);
				} 
				//如果不是第一层,那么放到对应id的children中
				else {
					//如果不存在该pid的数据,取children会报错,因此赋值一个children
					if (!itemMap[pid]) {
						itemMap[pid] = {
							children: [],
						}
					}
					console.log(itemMap[pid]);
					//将子级数据放到对应的children里面
					itemMap[pid].children.push(treeItem)
				}

			}
			return result;
		}
		console.log(arrayToTree(arr))

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值