material-ui 当内容更改时,弹出窗口不会重新定位

wi3ka0sx  于 2022-10-29  发布在  其他
关注(0)|答案(1)|浏览(121)

如果弹出窗口的内容在打开后发生更改,弹出窗口将不会重新定位以避免溢出页面

  • 最新版本中存在此问题。
  • 我已经搜索了此存储库的issues,并认为这不是重复的。

当前行为😯

弹出框不改变位置,可以溢出

预期行为🤔

弹出窗口更改位置,但不会溢出

重现步骤🕹

https://codesandbox.io/s/popover-doesnt-obvesrve-changes-properly-iprcx?file=/content.js
操作步骤:
1.开启沙箱
1.点击按钮
1.等待1秒钟
1.看到弹出窗口底部溢出了页面

上下文🔦

我的使用案例:
提示按钮应显示一个小的项目表,点击后从后端获取。
在项目被提取后,表明显地增大并且不再适合。
此外,提示按钮恰好位于屏幕的右边框附近,因此生成的表也会水平溢出页面。
请注意,将内容移出它自己的组件将解决这个问题,因为更改将强制整个Popover重新呈现,但我不能在真实的应用程序中这样做,因为内容是它自己的组件,并在Popover之外使用了4次以上。

您的环境🌎

'npx @mui/环境信息'系统:操作系统:Windows 10 10.0.19043下载节点:16.8.0 - C:\程序文件\节点\节点. EXEYarn:1.22.11 - ~\应用程序数据\漫游\npm\纱.命令npm:7.21.0 - C:\程序文件\节点\npm.CMD浏览器:镶边:未找到边:斯巴达(44.19041.1023.0)、铬(93.0.961.47)纳米封装:@梅姐/芯:5.0.0-alpha.47 @梅姐/图标-材质:^5.0.0 =〉5.0.0 @实验室:^5.0.0-α 47 =〉5.0.0-α 47 @ μ i/材料:^5.0.0 =〉5.0.0 @梅/私人主题化:5.0.0@mui/样式引擎-sc:^5.0.0 =〉5.0.0 @梅/款式:^5.0.0 =〉5.0.0@mui/系统:5.0.0@mui/类型:7.0.0@mui/实用程序:5.0.0 @类型/React:^17.0.21 =〉17.0.21React:^17.0.2 =〉17.0.2React域:^17.0.2 =〉17.0.2样式化组件:^5.3.1 =〉5.3.1打印脚本:^4.4.3 =〉第4.4.3节

Chrome 96.0.4645.0
FIrefox 93.0b5 (64-bit)
o2rvlv0m

o2rvlv0m1#

解决方法还可以定义弹出窗口的maxHeight
“〈弹出
识别码={识别码}
打开={打开}
锚点El ={锚点El}
onClose={处理关闭}
锚点原点={{
垂直:“底部”,
水平:“右”
}}
sx={{最大宽度:“300 px”,最大高度:“300像素”}}

>`

相关问题