解决方法是将el-icon移出#title,但el-sub-menu的情况需保持el-icon在内,否则显示异常。调整后的代码使菜单项在展开和折叠状态下均能正确显示图标。 错误示范: <el-menu-item v-if="hasChild(item) == 0":index="resolvePath(item.path)":key="resolvePath(item.path)" ><template #title> <el-icon> ...
二、原因: 随着菜单项数据越来越多,使用el-icon动态加载就会造成卡顿的问题,也就是说每次动态加载都会重新渲染一遍, 那么就极大地影响网页性能,下面是el-icon的动态加载示例: <el-icon> <component :is="item?.meta?.icon"></component> </el-icon> 三、解决方案: 本地存svg图标,然后通过封装svg-icon组件,...
Element Plus Version:2.8.7 Browser / OS:全部浏览器 Build Tool:Vite Reproduction Related Component el-tree Reproduction Link Element Plus Playground Steps to reproduce 1.点击expand按钮展开,第一次展开是顺畅的 2.点击collapse按钮折叠 3.点击expand按钮展开,在最后层级的菜单动画会卡顿一下 ...
Bug Type: Component Environment Vue Version: 3.4.14 Element Plus Version: 2.5.1 Browser / OS: mac os ventura 13.1 Build Tool: Vite Reproduction Related Component el-menu el-menu-item el-sub-menu el-menu-item-group Reproduction Link CodeS...
vue3+element plus项目,当使用了el-table的展开行时,想要实现全部展开功能,在全部展开时会卡顿,阻塞线程。使用了:expand-row-keys="expandRowArr",通过将key全部插入数组expandRowArr.value = comm...
element plus布局容器高度与位置有问题 elementui页面布局器 目录 一、布满整个页面 二、主页Header布局 三、主页左侧带单布局 四、axios请求拦截器添加token,保证拥有获取数据的权限 五、发起请求获取左侧菜单数据 六、左侧菜单UI绘制 6.1优化一级菜单 6.2当打开一个一级菜单后其他一级菜单关闭...
多个页面调用同一个接口 作为下拉框的选项数据,接口返回上千条 导致页面异常卡顿 解决办法: 使用Select V2 虚拟列表选择器 代码示例: <el-form-itemlabel="场所名称"><el-select-v2class="row-inp"v-model="queryForm.id":options="placeData"clearable filterable placeholder="请选择场所"></el-select-v2><...
Vue3 结合 Element Plus 开发的页面在部署到线上后出现卡顿,特别是在页面初始加载时,可能由多种因素导致。以下是一些可能的原因及排查方向: 1. 资源加载时间过长 大文件或过多资源:检查是否有大文件(如图片、视频、库文件等)在加载时阻塞了页面渲染。 网络延迟:线上环境可能由于网络延迟导致资源加载缓慢。 服务器...
ElementPlus/Element-el-table数据量很大、在没有分页的时候页面会出现卡顿的情况 1 收藏 其实对于el-table 本身我也没有好的解决方案、只能给遇到同样问题的小伙伴推荐一下vxe-table了,vxe-table完全可以解决卡顿的问题 我用的是 vue3.x + vite 其他版本的vue也是支持的详情可以看下方的 gitHub和vxe-table文档 ...