关于el-dialog中@close事件和取消确认按钮并用，会触发两次关闭表单的操作
简介：
el-dialog绑定了close方法，el-dialog中的子元素【确认按钮】绑定了click事件，当执行子元素绑定的click事件时，除执行子元素绑定的click方法中的语句，还会执行close中的语句。当绑定的close和click事件中执行逻辑不一致时，最终实现的是close中的逻辑。文章来源：https://www.toymoban.com/news/detail-756809.html
解决方法：
- 当close和click按钮的业务逻辑不一致时，我们将取消(点击右上角的x)的逻辑写在before-close的方法中
- 当close和click按钮的业务逻辑一致时，我们将取消(点击右上角的x)的逻辑可以写在close方法中
代码如下：
<el-dialog
title="用户注册"
:visible.sync="dialogVisible"
width="45%"
:close-on-click-modal="false"
@before-close="closeDialogHead"
>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click.stop="onConfirm">确认</el-button>
<el-button
@click="closeDialog"
style="border: 1px solid #001f76; color: #001f76"
>关闭</el-button
>
</span>
</el-dialog>
参考
https://blog.csdn.net/Note_creek/article/details/129182906文章来源地址https://www.toymoban.com/news/detail-756809.html
到了这里，关于关于el-dialog中@close事件和取消确认按钮并用，会触发两次关闭表单的操作的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
