小编Fra*_*sco的帖子

当scrollTop为零时在渲染后反应滚动位置

我试图了解可滚动div中的数据更改时react的行为。

如果新数据包含一些当前可见的项目,则react将管理滚动位置以使那些元素保持可见。

想象一下两组元素:a,b,c,d,e,f,g,h,if,g,h,i,j,k,l,m一个容器div,它在垂直的可滚动列表中显示它们,足够大,一次只能显示两个元素。

如果我向下滚动到element f然后更改数据,element f仍然是可见的。我相信这是可行的,因为每个元素都有其自己的唯一密钥。

如果滚动位置为0,则行为会有所不同:呈现新元素后,如果我更改回第一组,则滚动将仍为零,而不是on f。如果尝试此操作,则仅向下滚动一个像素即可正常工作。

这里是一个完整的最小工作示例:https : //codepen.io/depsir/pen/OGGZPd

所以这两个问题:

  1. 对此有反应吗?如果是这样,是否有任何有关此行为的文档?
  2. 即使在渲染器中,我如何仍然保持常见的可见元素scrollTop = 0


编辑:我发现示例的行为在浏览器之间是不同的:firefox mobile和safari在任何情况下都保持滚动位置固定。

scroll reactjs

9
推荐指数
1
解决办法
455
查看次数

标签 统计

reactjs ×1

scroll ×1