vue3.0 element-plus 不同版本 el-popover 循环优化

表格内循环el-popover

渲染以后的页面,数据量很大的时候页面会卡,生成的代码:

解决思路:将el-popover提出来,不参与循环,让el-popover只渲染一次

1、以1.1.0-beta.24版为例(低版本)

红色下划线部分是关键点

v-popover的值与el-popover的ref值要一致

2、以2.3.9版为例(当前新版本)

与低版本不同, v-popover被弃用了

以官方文档为例

:virtual-ref 可以直接传dom,这样变得更简单了,主需要把需要操作的控件对应的dom直接赋值给变量,传给:virtual-ref就行,举例:

相关推荐
!win !6 分钟前
uni-app项目从0-1基础架构搭建全流程
前端·uni-app
c_zyer34 分钟前
使用 nvm 管理 Node.js 和 npm 版本
前端·npm·node.js
布Coder1 小时前
前端 vue + element-ui 框架从 0 - 1 搭建
前端·javascript·vue.js
i_am_a_div_日积月累_1 小时前
Element Plus 取消el-form-item点击触发组件,改为原生表单控件
前端·vue.js·elementui
集成显卡1 小时前
网页 H5 微应用接入钉钉自动登录
前端·后端·钉钉
paintstar1 小时前
el-scrollbar 获取滚动条高度 并将滚动条保持在低端
前端·学习·vue·css3
天天进步20152 小时前
前端测试策略:单元测试到 E2E 测试
前端·单元测试
多啦爱梦的梦想3 小时前
项目中把webpack 打包改为vite 打包
前端·webpack
小刘不知道叫啥3 小时前
简单说一下 Webpack分包
前端·javascript·webpack·node.js
Dontla3 小时前
《黑马前端ajax+node.js+webpack+git教程》(笔记)——node.js教程+webpack教程(nodejs教程)
前端·ajax·node.js