当前位置: 首页 > news >正文

el-popover使用自定义图标

在这里插入图片描述
使用el-popover实现鼠标点击或浮动到自定义图标上弹出表格弹窗,官方文档上使用的是按钮el-button,如果想换成图标或其他的组件的话直接把el-button替换掉即可。注意替换之后的组件一定要加slot=“reference”,不然组件是显示不出来的。
代码如下:

<el-popoverplacement="right"width="400"trigger="click"><el-table :data="gridData"><el-table-column width="150" property="date" label="日期"></el-table-column><el-table-column width="100" property="name" label="姓名"></el-table-column><el-table-column width="300" property="address" label="地址"></el-table-column></el-table><i slot="reference" class="el-icon-question"></i>
</el-popover><script>export default {data() {return {gridData: [{date: '2016-05-02',name: '王小虎',address: '上海市普陀区金沙江路 1518 弄'}, {date: '2016-05-04',name: '王小虎',address: '上海市普陀区金沙江路 1518 弄'}, {date: '2016-05-01',name: '王小虎',address: '上海市普陀区金沙江路 1518 弄'}, {date: '2016-05-03',name: '王小虎',address: '上海市普陀区金沙江路 1518 弄'}]};}};
</script>
http://www.lryc.cn/news/112486.html

相关文章:

  • KCOM4串口转键鼠控制线测试说明
  • 2023华数杯数学建模C题完整5问代码思路分析
  • 02_kafka_基本概念_基础架构
  • HTTP 常用状态码 301 302 304 403
  • 分布式 - 服务器Nginx:一小时入门系列之静态网页配置
  • kubernetes网络之网络策略-----Network Policies - Example
  • 【GDI/GDI+】如何抓取屏幕保存到bitmap文件?
  • HDFS介绍
  • 每日一题——两数之和
  • Maven: ‘mvn‘ is not recognized as an internal or external command
  • CubeSLAM: Monocular 3D Object SLAM——论文简述
  • 【雕爷学编程】MicroPython动手做(30)——物联网之Blynk 2
  • linux scp 拷贝文件到目标linux系统
  • Oracle-expdp报错ORA-39077、06502(Bug-16928674)
  • Kafka入门,保姆级教学
  • RabbitMQ 过期时间(TTL)
  • C 语言练习题、持续更新
  • Android Q以上后台启动Activity初步尝试
  • 【torchlars】windows下载github中的torchlars包遇到的问题及解决方案
  • SolidUI社区-通用Prompt技巧
  • C++中类的封装写出一个文件加密的小项目
  • 【网络编程·传输层】UDP和TCP的报头
  • C语言编程技巧 全局变量在多个c文件中公用的方法
  • 【HDFS】NN处理全量块汇报时reportDiff的一些细节
  • JVM之类加载与字节码(一)
  • 【数据结构OJ题】合并两个有序数组
  • 数据结构笔记--归并排序及其拓展题(小和问题、逆序对问题)
  • flutter开发实战-实现css线性渐变转换flutter渐变LinearGradient功能
  • python推理小游戏bagels
  • DBSCAN聚类