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;
	}
相关推荐
Jmyd01232 分钟前
VR全景线上展会制作流程技术解析:全景采集、点云重建与Web端渲染优化实战
前端·javascript·vr·三维数字化
℘团子এ12 分钟前
vue2中自定义指令的使用
前端·javascript·vue.js
怕浪猫36 分钟前
腾讯又交作业了,开源版 WorkBuddy 太夯了!这回是只粉色小章鱼Octop!
javascript·面试·agent
梦醒沉醉43 分钟前
8、正则表达式
javascript
sun_weitao2 小时前
Chrome 扩展插件开发指南
前端·javascript·chrome
labview_自动化2 小时前
cvat部署记录
javascript·labview
BD_Marathon2 小时前
ChatPromptTemplate的高级特性
android·java·javascript
用户6259411859492 小时前
vibe coding怎么入门:从自然语言到可运行代码的完整指南
javascript
℘团子এ2 小时前
vue3中自定义指令的使用
前端·javascript·vue.js
Ai-_Man3 小时前
DeepSeek生成的内容能否下载吗?
开发语言·javascript·人工智能·小程序·ecmascript