反应：在用户导航之前立即恢复滚动位置/调用历史记录.replace（）

Question

我的用例是当用户导航回到各自的（父）路线时，在React组件中恢复<div>的滚动位置。我使用<div>跟踪onScroll的滚动位置。我的想法是将滚动位置保存在历史状态。可以在滚动事件处理程序中使用更新的状态对象调用history.replace()，但是性能很差（我假设history.replace()会强制组件重新呈现）。

我还尝试在history.replace()中调用componentWillUnmount()（同时将滚动位置保存为组件的实例属性）。但是，由于history.location已更改为新位置，为时已晚。

历史记录侦听器（history.listen()）也是如此。

是否有其他方法可以实现滚动位置恢复？

Answer 1

从您的描述看来，您似乎正在与React及其历史API的使用作斗争。

另一种解决方案可能是仅在历史记录中存储一个数组位置，而这仅需要一次替换，并管理更新以滚动值本身在（例如）localStorage内的数组中的值。

希望这会有所帮助。