校园网站建设培训稿,免费个人网站平台,个人网站设计首页,设计制作公司网站el-tree数据量过大#xff0c;造成浏览器卡死、崩溃 场景#xff1a;树形结构展示#xff0c;数据超级多#xff0c;超过万条#xff0c;每次打开都会崩溃
我这里采用的是引入新的插件虚拟树#xff0c;它是参照element-plus 中TreeV2改造vue2.x版本虚拟化树形控件…el-tree数据量过大造成浏览器卡死、崩溃 场景树形结构展示数据超级多超过万条每次打开都会崩溃
我这里采用的是引入新的插件虚拟树它是参照element-plus 中TreeV2改造vue2.x版本虚拟化树形控件不论你的数据量多大虚拟树都能毫无压力地处理。
虚拟树传送门https://sangtian152.github.io/virtual-tree/zh/demo/#attributes
前面下载引入这里就不多赘述了都一样的。
具体代码如下
vl-treereftreeclassfilter-tree:propsdefaultProps:datadataList:height430show-checkbox:expand-on-click-nodefalse:default-checked-keysdefaultChecked:default-expanded-keysdefalutExpanded:filter-methodsfilterMethod/vl-tree别的都和el-tree差不多不会用的可以点传送门去看看里面属性方法都有的。
但是用这个还有一个问题就是当数据量过大且都选中的时候回显的时候会超级超级慢而且还会崩溃但是这个时候是由于回显的数据过多引起的。尝试了好多方法都不行分时函数都用上了虽然不崩溃了但是超级慢。
后来的解决办法是
回显的时候调用后端接口让后端只返回选中的父节点让它自动关联选中子节点暂时解决了这个问题。
