element-plus使用弹窗里面有个el-tree大量数据会导致dom渲染缓慢问题。第一次打开弹窗很慢半天才打开

复制代码
<el-dialog v-model="drawerVisible" :destroy-on-close="true" size="450px" ><el-tree-select
  v-model="drawerProps"
  :data="areaData"
  check-strictly
  :render-after-expand="false"
  show-checkbox
/>
</el-dialog>
复制代码
import areaData from "@/assets/json/area.json"

这个是我本地的一个josn文件也不是很大131k。但是打开这个弹窗的时候,第一次打开会超级的慢。后面就好了。

感觉是弹窗里面的内容加载,在加载完之后才会显示弹窗,所以弹窗第一次打开的时候就非常的慢。

开始想到要用懒加载,点击一个层级展开一个。但是这样效果不太好。我使用这个主要是希望每个层级都可以选择,而不是只能选子节点。

花了好久最后才发现原来改一个参数就可以了。

最后就改了:render-after-expand="false"这个false改成true就好了。

相关推荐
道友可好2 分钟前
让 AI 自己验收,等于让学生自己批卷
前端·人工智能·后端
yingyima11 分钟前
Go 语言正则表达式速查手册:30 分钟掌握核心语法与实战技巧
前端
大蝴蝶博努奇a15 分钟前
使用ChatGPT 解决各类代码报错
前端
胡志辉22 分钟前
深入浅出 call、apply、bind
前端·javascript·后端
iccb10131 小时前
5年,一个程序员是如何把私有化在线客服系统做到第一名的
前端·后端·github
假如让我当三天老蒯1 小时前
回归基本功:Map/Set 与 WeakMap/WeakSet 的区别
前端·面试
IT乐手1 小时前
48队都装不下你|国足第24次让全世界失望
前端
SoaringHeart2 小时前
Flutter最佳实践:IM聊天文字链接自动识别跳转
前端·flutter
掘金一周3 小时前
企业中要做智能体,最佳的方案是什么? | 沸点周刊 6.18
前端·人工智能·ai编程
Darling噜啦啦3 小时前
CSS 3D 变换与 Flex 布局实战:从零打造旋转立方体
前端·css