el-table原始列表转换成树形数据

element-ui的el-table可以显示树形数据,不过对数据格式有要求,只有带children属性的行才能树形展开和收起,假设原始数据是json列表,数据已经按colx排序,我们希望在el-table中同colx值得只显示一条,有多条数据的可以树形展开和收起。下面我们用js来实现,该转换功能在node后端或者javascript前端都可以。

javascript 复制代码
function tree(list){
	if (list.length==0) return [];
	let newlist=[list[0]];
	
	for (let i=1;i<list.length;i++) {
		if (list[i]["colx"]===newlist[newlist.length-1]["colx"]) { 
			if (newlist[newlist.length-1]["children"]==undefined) {
				newlist[newlist.length-1]["children"]=[list[i]]
				}
			else { newlist[newlist.length-1]["children"].push(list[i]); }
			}
		else {
			newlist.push(list[i]);
			}
		}
	return newlist;
	}
相关推荐
ZC跨境爬虫7 小时前
跟着MDN学HTML_day_48:(Node接口)
前端·javascript·ui·html·音视频
kyriewen10 小时前
半夜三点线上崩了,AI替我背了锅——用AI排错,五分钟定位三年老bug
前端·javascript·ai编程
王木风11 小时前
终端里的编程副驾:DeepSeek-TUI-项目深度拆解,实测与原理分析
linux·运维·人工智能·rust·node.js
AI_paid_community12 小时前
98.5k Star!GitHub官方开源的这个工具,正在把"vibe coding"扫进历史的垃圾桶
javascript·claude
AI_paid_community12 小时前
用 Claude Code 写了一年代码,装了这 18 个 Skills 之后,我才知道自己一直在"氛围编程"
javascript·面试
隔壁老王111113 小时前
浅谈JavaScript内存管理
javascript
吹牛不交税13 小时前
tree-transfer-vue3 前端插件安装问题解决(--legacy-peer-deps)(其他插件可考虑)适用
前端·javascript·vue.js
Appoint_x13 小时前
设计稿自己会说话:我用 Claude 给 Figma 做了个 AI 上下文插件
前端·javascript