reactjs固定数据表中的无限滚动

Posted 2023-02-21

【中文标题】reactjs固定数据表中的无限滚动

【英文标题】：infinity scroll in reactjs fixed data table

【发布时间】：2016-08-14 01:19:53

【问题描述】：

我需要为固定数据表实现无限滚动功能。 我检查了 API 文档，当用户滚动到表格末尾时没有调度事件。唯一看似有用的事件是 onScrollEnd，但该事件让我返回了 scrollX 和 scrollY。 ScrollY 非常大，我不知道如何使用这个数字来检测用户是否在接近尾端滚动。 谁能告诉我如何使用固定数据表实现无限滚动功能？ 谢谢

【参考方案1】：

遗憾的是，此类组件没有适当的 API 用于无限滚动。 解决方案是这样的（但很丑）：

onScrollEnd() 返回一个 scrollY 值。您需要将此值保留在组件状态中，例如this.state.scroll。在每个 onScrollEnd 上，您必须检查是否相等：

this.state.scroll === nextState.scroll && nextState.scroll !== 0 // you dont want to load dada on scrollTop。

如果这是真的，那么您可以加载其他数据，更新您的商店或您拥有的内容，然后重新渲染组件。

大问题：onScrollEnd() 函数非常非常慢 :( 也许做去抖动/节流？