在使用Modal 对话框的时候，window尺寸变化，会导致对话框被被关闭

[WeMadeCode]

Reproduction link

https://ant-design.antgroup.com/components/modal-cn

Steps to reproduce

1. 打开官网https://ant-design.antgroup.com/components/modal-cn
   2.点击按钮【Open Modal with async logic】
2. 缩减Chrome浏览器视口
   4.观察弹出的Modal 【The modal will be closed after two seconds】突然之间被关闭了

What is expected?

在使用Modal 对话框的时候，window尺寸变化，不会导致对话框被被关闭

What is actually happening?

在使用Modal 对话框的时候，window尺寸变化，会导致对话框被被关闭

Environment	Info
antd	undefined
React	18
System	Mac OS 14
Browser	124.0.6367.80

[zombieJ]

The modal will be closed after two seconds 的意思是 这个窗口两秒后会关掉，它和窗体改变大小没有关系，是 Demo 本身的逻辑。或者提供一个干净的重现代码看看？

[github-actions]

Hello @WeMadeCode. Please provide a online reproduction by forking codesandbox of antd@5.x or antd@4.x, or provide a minimal GitHub repository. Issues labeled by Need Reproduce will be closed if no activities in 3 days.

你好 @WeMadeCode，我们需要你提供一个在线的重现实例以便于我们帮你排查问题。你可以通过点击这里创建一个 antd@5.x 或 antd@4.x 的 codesandbox，或者提供一个最小化的 GitHub 仓库。3 天内未跟进此 issue 将会被自动关闭。

什么是最小化重现，为什么这是必需的？

[WeMadeCode]

@zombieJ 你好。我使用本地Demo 未能复现改问题。但是我使用官网复现了改问题。
可以参考下 如下录屏

2024-04-28.09.39.49.mov

[wanpan11]

我使用本地Demo 未能复现改问题。但是我使用官网复现了改问题。 可以参考下 如下录屏

@WeMadeCode 业务里你能复现吗，目前我试的只有官网多demo时能复现（把其他 demo 注释掉后，也无法复现）

[WeMadeCode]

@wanpan11 业务里面也能 稳定复现。使用的代码 就是 【Open Modal with async loginc】。但是 我新建Demo 使用【Open Modal with async loginc】 也就无法复现了。不确定 是不是其他代码 其他影响了 这个Modal组件。

[linxianxi]

官网是因为缩小后布局改变成一列，右边这个 section 整合到左边这个 section 里了，所以是先卸载（Modal 就没了）再重新 mount 了。你的业务有 bug 应该是你自己的问题。

[wanpan11]

@WeMadeCode Modal 本身没问题，官网的 demo 组件每次在屏幕尺寸变化导致 demo 换行的时候就会把 组件卸载掉，https://ant.design/components/modal-cn#components-modal-demo-static-info 用静态方法的就不会，你再检查下你的逻辑撒的

[WeMadeCode]

@WeMadeCode Modal 本身没问题，官网的 demo 组件每次在屏幕尺寸变化导致 demo 换行的时候就会把 组件卸载掉，https://ant.design/components/modal-cn#components-modal-demo-static-info 用静态方法的就不会，你再检查下你的逻辑撒的

@wanpan11 你好，我想继续了解下 【官网的 demo 组件每次在屏幕尺寸变化导致 demo 换行的时候就会把 组件卸载掉】这个动作是 Modal做的，还是官方Demo 主动卸载的？

[wanpan11]

这个动作是 Modal做的，还是官方Demo 主动卸载的？

这是官网的行为 与 Modal 自身无关，看下@linxianxi 的回复 他的更清楚一些

[WeMadeCode]

官网是因为缩小后布局改变成一列，右边这个 section 整合到左边这个 section 里了，所以是先卸载（Modal 就没了）再重新 mount 了。你的业务有 bug 应该是你自己的问题。

@wanpan11 是不是父元素（这里是session）尺寸位置的变化导致了 Modal被销毁了？

[wanpan11]

是 section 所在的组件卸载了，导致 Modal 也跟着卸载了

[WeMadeCode]

是 section 所在的组件卸载了，导致 Modal 也跟着卸载了

@wanpan11 Modal 直接挂载在 Body 下面的， 其实际直接父元素应该是Body。但是这里却受 理论上的父元素（这里是Session）的销毁影响。这是不是问题？

[wanpan11]

组件 和 dom 是不一样，可以看看相关的文章哦~

[WeMadeCode]

是 section 所在的组件卸载了，导致 Modal 也跟着卸载了

@wanpan11 所以 您觉得 【是 section 所在的组件卸载了，导致 Modal 也跟着卸载了】这不是问题 是么？

[wanpan11]

section 是人为卸载的 是在预期之中的。

[afc163]

看上去 antd 组件本身是没问题的，你遇到的是官网实现的预期逻辑。