Javascript React重新排序溢出的组件会导致页面跳转_Javascript_Html_Css_Reactjs

Javascript React重新排序溢出的组件会导致页面跳转

javascript html css reactjs

Javascript React重新排序溢出的组件会导致页面跳转,javascript,html,css,reactjs,Javascript,Html,Css,Reactjs,代码仅供参考按下按钮时，状态会发生变化，且#container1将替换为#container2。页面保持相同高度，外部容器保持相同高度。然而，在页面向下滚动（需要访问按钮）和按下按钮之后，页面滚动到中间的某个地方。我希望页面不会移动，因为没有改变布局，只有部分文本我需要容器有固定的高度，即使当里面的文本溢出时也是如此，而且似乎是溢出导致了这个页面跳转错误有趣的事实：如果#container2只有一个div元素，那么这个bug似乎不会发生只有当状态第一次从#container1更改为#

代码仅供参考

按下按钮时，状态会发生变化，且#container1将替换为#container2。页面保持相同高度，外部容器保持相同高度。然而，在页面向下滚动（需要访问按钮）和按下按钮之后，页面滚动到中间的某个地方。我希望页面不会移动，因为没有改变布局，只有部分文本

我需要容器有固定的高度，即使当里面的文本溢出时也是如此，而且似乎是溢出导致了这个页面跳转错误

有趣的事实：

如果#container2只有一个div元素，那么这个bug似乎不会发生
只有当状态第一次从#container1更改为#container2时才会出现此错误，但如果在查看#container1时向上滚动任意数量，则下次状态更改时会出现此错误
大小很重要。我可以在编辑器和“切换响应预览”模式下以“平板电脑”或“桌面”大小重现该错误。如果我在新选项卡中查看页面，则不会出现错误
我使用了Chrome，但快速测试表明该漏洞也出现在Firefox和Edge上

容器1