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

相关推荐
Dreamy smile1 分钟前
css :nth-child() 完全用法指南
前端·css
Southern Wind2 分钟前
从零开始封装一个优雅的图片上传组件 - 二次改装 Layui-Upload 的教程(附完整封装代码)
前端·javascript·html·layui·css3
小白菜学前端4 分钟前
Vue3 + TS 解决 ESLint 与 Prettier 格式化冲突
前端·javascript·vue.js
第二只羽毛9 分钟前
搜索引擎项目
大数据·前端·c++·搜索引擎·vim
The_era_achievs_hero13 分钟前
封装api方法(全面)
前端·javascript·uni-app·api·封装接口
一殊酒16 分钟前
【前端开发】Vue项目多客户配置自动化方案【二】
javascript·vue.js·自动化
Mr Xu_17 分钟前
深入解析 getBoundingClientRect 与 offsetTop:解决 Vue 平滑滚动偏移误差问题
前端·javascript·vue.js
Mr-Wanter17 分钟前
vue 解决img图片路径存在但图片无法访问时显示错误的问题
前端·vue·img
muddjsv17 分钟前
近些年前端开发主流技术全景:趋势、工具与实践指南
前端
阿里巴啦39 分钟前
照片隐私清理工具:基于Taro 4 + Vue 3 + piexifjs开发实践项目
vue.js·照片隐私清除·piexifjs·exif 解析