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就好了。

相关推荐
Tongsr15 分钟前
别只混淆代码:用 Kaleido 加固整个 Android Release AAB
前端·算法·github
郭邯20 分钟前
从零到一:我用 AI 写了一个贷款计算器,顺便把等额本息公式彻底搞懂了
前端
汉堡大王952725 分钟前
面试官:讲讲归并排序 —— 为什么它能在面试里反复出现?
前端·javascript·面试
kyriewen32 分钟前
别再只给人写页面了:AI 已经开始自己点你的按钮、填你的表单
前端·javascript·人工智能
天天喝旺仔35 分钟前
Vue 3 组合式 API:从 Options 迁移到 script setup
前端·javascript·vue.js
知了清语36 分钟前
以测试为盾,重构为矛——老旧前端系统迭代中的“测试先行”实践总结
前端
攀小黑1 小时前
vue3+Web Speech API 封装了一个弹窗语音输入
前端·macos·xcode
roamingcode1 小时前
4.5 小时,从一句话需求到可安装的 Chrome 插件:一次 AI 结对开发的完整复盘
前端·人工智能·chrome·claude·codex
️学习的小王2 小时前
Windows Claude Code 接入 Playwright‑MCP,调用本机Edge浏览器(避坑完整教程)
前端·windows·edge
律宏阔2 小时前
CloakBrowser 开发踩坑笔记
前端·浏览器