奉劝不要在ElementPlus中使用el-table渲染大量树形结构数据

奉劝不要在ElementPlus中使用el-table渲染大量树形结构数据(el-tree不知道会不会也存在这个问题)

记录一个悲催的建树历程:
链接:这是我多日前在CSDN上的一个提问
奉劝不要在ElementPlus中使用el-table渲染大量树形结构数据_第1张图片

提问内容是,ElementPlus的el-table渲染一颗表格树形结构,在其中嵌入选择器,在大量树形节点的情况下会导致页面崩溃。
但是真正让我崩溃的是,即使我不嵌入选择器,单输出节点名称,在拥有1w - 3w左右节点的树形结构中,页面照样崩溃掉(似乎只要达到3000节点以上,性能都很差)奉劝不要在ElementPlus中使用el-table渲染大量树形结构数据_第2张图片
后面想着研究下官方文档提供的虚拟表格怎么用,我这卑微前端实习生表示,那个文档写的都是啥。。。

想破头也没想出办法,最后求助领导,领导说这个无解。后面实在不行,项目里面就不再使用el-table去渲染树形结构,统一换成了Vxe- table ,这拓展组件真的救了我一命,3w左右节点的树形结构秒出,而且支持虚拟滚动,并且作者估计借鉴了Element,设计方面和Element极其相似。用起来真的毫不费劲,看官方文档好像还是国人开发的。还有一点是,Element-Plus的树形结构还需要前端自己去将平铺的数组转化成对象里带children的数组嵌套数组的结构,但Vxe- table仅需要将平铺的数组(树形节点)直接丢进去就行了,拓展组件自动帮你建树,太人性化了吧呜呜呜呜。

你可能感兴趣的:(前端,vue.js,javascript,前端,elementui,el-tree)