el-dialog点击关闭后调用一个方法,待该方法是执行完成后再关闭弹窗
时间: 2023-11-27 15:52:06 浏览: 227
你可以使用 el-dialog 的 before-close 属性来监听弹窗关闭事件,并在该事件中调用你想要执行的方法。在方法执行完成后,再手动关闭弹窗。
例如:
```html
<template>
<el-dialog
title="弹窗标题"
:visible.sync="dialogVisible"
:before-close="handleBeforeClose"
>
<!-- 弹窗内容 -->
</el-dialog>
</template>
<script>
export default {
data() {
return {
dialogVisible: false,
};
},
methods: {
handleBeforeClose(done) {
// 调用你想要执行的方法
this.doSomethingAsync().then(() => {
// 方法执行完后再手动关闭弹窗
done();
});
// 阻止弹窗自动关闭
// done(false);
},
doSomethingAsync() {
// 异步执行的方法
},
},
};
</script>
```
在 before-close 事件中,接受一个 done 函数作为参数,你需要在该函数中调用它来手动关闭弹窗。
如果你需要在方法执行完成前阻止弹窗关闭,可以在调用 done 函数前,传入 false 参数。
阅读全文