reactjs - 重新渲染后保持滚动

Question

我有很多复选框的下拉列表，所以这个容器有滚动。但是当我点击任何复选框时 - 它会选择\取消选择自身，然后状态发生变化。

所以问题是重新渲染后这个容器又回到了顶部。是否可以在渲染后保持容器的滚动而不将其保存到状态？

标签： reactjsscrollredux

Answer 1

您可以在提交阶段之前保存滚动位置的“快照”。

getSnapshotBeforeUpdate()显示您正在寻找的内容。

文档示例将当前滚动位置保存在getSnapshotBeforeUpdate生命周期方法中，然后使用snapshot传递给的值componentDidUpdate(prevProps, prevState, snapshot)作为最后一个参数来恢复滚动位置。

它不需要创建状态来按您的要求保存滚动位置。