Bug: 嵌套弹窗的行为不太正常

[dongivan]

Version

Vben Admin V5

Describe the bug?

以下代码基于playground/src/views/examples/modal/nested-demo.vue

• 情况1
  如原文件，按外层modal进行connectedComponent，内层也进行connectedComponent，并且内层的BaseModal是内层Modal的子组件的场景，正常使用。

• 情况2
  外层不变，内层不进行connectedComponent，直接在内层的Modal的默认slot中编写内容：

<script lang="ts" setup>
import { useVbenModal } from '@vben/common-ui';

import { Button } from 'ant-design-vue';

- import DragDemo from './drag-demo.vue';
- 
const [Modal] = useVbenModal({
  destroyOnClose: true,
});
const [BaseModal, baseModalApi] = useVbenModal({
-  connectedComponent: DragDemo,
});

function openNestedModal() {
  baseModalApi.open();
}
</script>

<template>
  <Modal title="嵌套弹窗示例">
    <Button @click="openNestedModal" type="primary">打开子弹窗</Button>
-    <BaseModal />
+    <BaseModal>
+      <div>Base Modal</div>
+    </BaseModal>
  </Modal>
</template>

此时外层弹窗无法正常弹出，并且控制台没有报错。

• 情况3
  类似情况1，但是交换第22与23行，让内层的Modal与BaseModal同级（此时内层的<template>有两个根）。弹窗正常，但是我不确定这样使用是否有什么隐患，因为既然例子中外层connectedComponent的组件要由useVbenForm导出的Modal来包裹，那么按理来说有两个都是useVbenForm导出的组件作为内层的根是否会有问题？

• 情况4
  类似情况2，但是我们让内层的Modal与BaseModal同级（此时内层的<template>有两个根）。此时点击最外层页面上的打开嵌套弹窗按钮，弹出的是内层而不是外层。

感觉情况3和4不是正常使用方式，但是情况2是正常方式，毕竟简单的内层Modal没必要再抽离一次组件啊。

Reproduction

System Info

-

Relevant log output

Validations

• Read the docs
• Ensure the code is up to date. (Some issues have been fixed in the latest version)
• I have searched the existing issues and checked that my issue does not duplicate any existing issues.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• The provided reproduction is a minimal reproducible example of the bug.