重复

• 我搜索了现有的问题

最新版本

• 我测试了最新版本

摘要 💡

FocusTrap 组件应该能够在不滚动到选定元素的情况下聚焦。可以将默认行为设置为滚动到元素，用户可以选择 preventScroll={true} 。

示例 🌈

这里有一个具体的例子，其中 FocusTrap 滚动到视口之外的元素并触发布局偏移，在页面底部创建一个不可操作的空白空间。请注意，body 有 overflow: hidden ,而正在滚动的元素有 position: absolute 。
https://codesandbox.io/s/joyride-qwed1r?file=/src/App.tsx

• https://github.com/focus-trap/focus-trap/tree/masterpreventScroll 选项。

动机 🔦

在我给出的例子中，我尝试复制一个特定情况，我正在使用 react-joyride 进行教程的步骤。在这种情况下，定位可能是动态的：
例如，我有一个动态创建的元素列表，我在列表的最底部渲染 Popper ,有时它会溢出窗口。我的猜测是，由于 react-joyride 使用类似门户的方法，当我们聚焦时触发的默认滚动事件会导致布局偏移，因为它相对于 html 或 document 是绝对定位的。在这种情况下(尤其是对于较小的屏幕),可能值得提供 preventFocus 的选项。