使用element ui 开发的项目，需要做图片点击放大的功能，本想用Popover 弹出框，但一直失灵，点击后没有反应。
用浏览器查看了一下，发现element ui 会在popover外自动添加一个<span> ，而该span默认pointer-events: none，导致点击事件失效。
解决方法：以官方用法为例
<el-popover placement="bottom" title="标题" width="200" trigger="click" content="这是一段内容,这是一段内容,这是一段内容,这是一段内容。">
<el-button style="pointer-events: auto;" slot="reference">click 激活</el-button>
</el-popover>
在触发点击事件的按钮处加上style="pointer-events: auto;"
Popover 弹出框文档：
https://element.eleme.io/#/zh-CN/component/popover
使用element ui 开发的项目，需要做图片点击放大的功能，本想用Popover 弹出框，但一直失灵，点击后没...
VUE二维数组+Popover弹出框实现嵌套分类列表 前端框架：VUE UI框架：Element UI 背景：课程...
增加一个弹出框，为按钮标签添加data-toggle=”popover”使用弹出框(popover)插件，必须使用...
直接使用 popover 弹出框的时候，是没有任何问题的，但是在 el-table 中使用 popover 弹出框...
Bootstrap 弹出框（Popover）插件 弹出框（Popover）与工具提示（Tooltip）类似，提供了...
Vue项目中，使用Element-UI Dialog对话框组件，关闭弹框时弹出如下警告： 意思是子组件dialog...
最近在项目中使用elementui中的table组件搭配popover组件进行开发，遇到了一些问题，特意在此记录：...
这里的各种坑，并不代表element ui 不好，只是记录自己没有仔细看文档例子，而踩的坑。 select选择器中...
这里的各种坑，并不代表element ui 不好，只是记录自己没有仔细看文档例子，而踩的坑。 首先，prop和ru...
这里的各种坑，并不代表element ui 不好，只是记录自己没有仔细看文档例子，而踩的坑。 每次做各种form表...
本文标题：【前端】element ui 使用Popover 弹出框踩坑记录
本文链接：https://www.haomeiwen.com/subject/dndfhhtx.html
网友评论