解决element-ui中Popconfirm气泡确认框的事件不生效问题
更新时间：2022年07月29日 10:46:23 作者：顽强的韭菜
这篇文章主要介绍了解决element-ui中Popconfirm气泡确认框的事件不生效问题，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教
element-ui中Popconfirm气泡确认框的事件不生效
今天在使用到element-ui中的Popconfirm 气泡确认框组件时，需要在点击确定按钮时触发绑定的事件
按照官方文档提供的事件类型为其绑定的事件，但并没有被触发
以下是官网给出的事件类型
<el-popconfirm title="这是一段内容确定删除吗？" @confirm="delete">
<el-button slot="reference">删除</el-button>
</el-popconfirm>上面代码中定义了事件@confirm="delete"，但点击确定按钮之后，并没有执行绑定的方法delete
正确方式：
<el-popconfirm title="这是一段内容确定删除吗？" @onconfirm="delete">
<el-button slot="reference">删除</el-button>
</el-popconfirm>触发方式是用@onconfirm定义事件，而不是@confirm，之后再点击确认按钮就可以触发绑定的方法了。同样取消按钮的事件也需要使用@oncancel来绑定才可以触发。
(2.15.6版本解决)elementui popconfirm气泡确认事件失效
问题：
- confirm事件无效
- cancel事件无效
解决：2.15.6版本已解决
- 官方文档书写错误
- 更改确认事件名：onConfirm
- 更改取消事件名：onCancel
官方文档：
官方源码：
以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。
相关文章
vue组件数据传递、父子组件数据获取，slot,router路由功能示例
这篇文章主要介绍了vue组件数据传递、父子组件数据获取，slot,router路由功能,结合实例形式分析了vue.js组件数据传递、路由相关概念、原理及相关操作技巧,需要的朋友可以参考下2019-03-03
本文主要介绍了el-form表单实现校验的示例代码,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧2024-07-07
这篇文章主要介绍了9102年webpack4搭建vue项目的方法步骤，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2019-02-02
本篇文章主要介绍了在vue-cli项目中使用bootstrap的方法示例，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2018-04-04
计算属性是基于它们的依赖进行缓存的,只有在它的相关依赖发生改变时才会重新求值,而watch则是一个更为通用的监听器,它可以在数据变化时执行异步操作或开销较大的操作2025-01-01
这篇文章主要介绍了vue 简单自动补全的输入框的示例，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2018-03-03
vue在同一个组件内,方法之间经常需要互相调用,下面这篇文章主要给大家介绍了关于vue2中组件互相调用实例methods中的方法实现的相关资料,文中通过示例代码介绍的非常详细,需要的朋友可以参考下2022-08-08
本文主要介绍了element中form组件prop嵌套属性的问题解决，文中通过示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2022-03-03
这篇文章主要为大家介绍了vue篇之事件总线EventBus使用示例详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪2022-09-09
在vue项目中,一般我们会遇到跨域的问题,vue项目中解决跨域是非常简单的,下面这篇文章主要给大家介绍了关于vue项目中常用解决跨域的方法,主要解释CROS和Proxy两种方式,需要的朋友可以参考下2022-12-12
最新评论