使用虚拟滚动优化el-table长列表加快运行速度

虚拟滚动 el-table-virtual-scroll 插件参考:https://segmentfault.com/a/1190000043074024

感谢作者帮助: https://github.com/xiaocheng555/el-table-virtual-scroll鼠标框选功能参考: js鼠标框选元素 - 掘金

项目背景: 在vue2中el-table的数据量太大,并且有点击单元格选中和鼠标框选单元格选中数据,并对数据进行操作的功能,所以在不使用虚拟滚动前,非常卡顿,使用后完美解决卡顿问题.

先安装插件:

npm i el-table-virtual-scroll -S

 还需要安装axios,模拟发送数据用

 下面是根据项目写的一个简单的demo,可以直接运行

 使用虚拟滚动优化el-table长列表加快运行速度_第1张图片






你可能感兴趣的:(vue,web前端,JS,vue.js,前端,javascript,elementui)