重复问题
- 我搜索了现有的问题
最新版本
- 我测试了最新版本
重现步骤 🕹
链接到实时示例：
步骤：
MUI5 - https://codesandbox.io/s/angry-mclaren-vgmhu6?file=/demo.tsx
- 在代码中嵌入一个对话框
- 将它设置为 open={false}
- 对话框仍然在DOM中渲染，但已关闭
MUI4- https://codesandbox.io/s/material-demo-forked-qm3dub?file=/demo.js - 在代码中嵌入一个对话框
- 将它设置为 open={false}
- 对话框不在DOM中渲染
这在MUI5文档的更改中没有提到。这破坏了我的应用中的一些功能
当前行为 😯
- 在代码中嵌入一个对话框
- 将它设置为 open={false}
- 对话框仍然渲染，但已关闭
预期行为 🤔
- 在代码中嵌入一个对话框
- 将它设置为 open={false}
- 对话框不应该渲染
上下文 🔦
从MUI4升级到MUI5时，对话框的行为发生了变化，导致了问题
你的环境 🌎
npx @mui/envinfo
Don't forget to mention which browser you used.
Output from `npx @mui/envinfo` goes here.
3条答案
按热度按时间fhg3lkii1#
感谢你报告这个问题，我认为我们可以更清楚地记录这个变化。
你是否介意分享更多关于这个变化如何影响你的应用程序的信息？
2ul0zpep2#
你好，我理解你的问题。这个问题可能是由于你的页面在关闭对话框后冻结了。这可能是由于你的条件渲染导致的。在V4中，条件渲染不再需要。你可以尝试将条件渲染替换为计算属性或方法来解决这个问题。
nszi6y053#
我遇到了一个问题，这个问题看起来非常相似(如果不是相同的)。它影响了我的应用程序，因为我已经将应用程序迁移到了React 18。此外，我还使用了mui v5。
我只能从手机上重现这个问题，而不是从桌面上。而且我也无法以确定性的方式重现这个问题。我可以在Android和iOS的Chrome浏览器上重现这个问题。我的应用程序中有多个对话框，它们都没有受到这个问题的影响。到目前为止，我还不知道如何给出一个可以重现这个问题的示例。
问题:即使open属性为假值，对话框仍然会随机渲染。具有此错误 bug 的应用程序会变得无响应，因为对话框仍然会使用一个0透明度的容器覆盖整个应用程序。
等待原因和解决方案的同时，我还设置了一个条件来避免在不应该渲染对话框时渲染它。这种hack当然会破坏模态动画，特别是关闭动画。
类似： #33748#32286