el-dialog中再打开另一个el-dialog
时间: 2024-05-24 17:07:54 浏览: 133
element ui 对话框el-dialog关闭事件详解
在 Element UI 的 el-dialog 中打开另一个 el-dialog 可以通过以下步骤实现:
1. 确保你已经在代码中引入了 Element UI 的 el-dialog 组件。
2. 在打开第一个 el-dialog 的方法中,加入 `beforeClose` 属性,这个属性可以设置一个回调函数,在第一个 el-dialog 关闭之前执行。
3. 在 `beforeClose` 回调函数中,通过 `this.$refs` 获取到第二个 el-dialog 的实例对象,并调用其 `open()` 方法打开第二个 el-dialog。
以下是一个示例代码:
```
<template>
<div>
<el-dialog
title="第一个弹框"
:visible.sync="dialogVisible"
:beforeClose="handleClose">
<p>内容</p>
</el-dialog>
<el-dialog
title="第二个弹框"
:visible.sync="dialogVisible2">
<p>内容</p>
</el-dialog>
</div>
</template>
<script>
export default {
data() {
return {
dialogVisible: false,
dialogVisible2: false
};
},
methods: {
handleClose(done) {
if (this.dialogVisible2) {
this.$refs.dialogVisible2.open();
done(false);
} else {
done();
}
}
}
};
</script>
```
阅读全文