介绍
React-infinite-scrolling 是一个无限滚动组件，用于 React 应用程序中懒加载大量内容。它封装了加载更多的功能，当滚动到底部时自动触发加载更多。
安装
使用 npm 进行安装
npm install react-infinite-scrolling --save
使用
导入模块，并使用 InfiniteScroll 组件
-- -------------------- ---- -------
------ ----- ---- --------
------ -------------- ---- ---------------------------
----- --- ------- --------------- -
------------------ -
-------------
-- -----
---------- - -
----- ---
-------- -----
----------- --
--
-
-- ------
------------- - -- -- -
--------------- -------- ---- ---
-- --------
------------- -- -
-- -------------- ----- -----------
----- ------- - ---------
-----------
----------- -- -- -
------ -
----- ----- ------------------------ - ----
--
---
-- ----
---------------
----- -------------------- ------------
-------- ------
----------- --------------------- - --
---
-- ------
--
-------- -
----- - ----- ------- - - -----------
------ -
---------------
------------------------ -- ------
------------------------- -- ---------
----------------- -- ------------ ----- ----------
---------------------------- -- ---------
-
--- ------- ---
---------------- ------ -- -
---- -----------------------------
---
-----------------
--
-
-
------ ------- ----参数
- dataLength（必填）：渲染的数据长度，用于检测是否需要加载更多数据
- next（必填）: 触发加载更多数据的回调函数
- hasMore（必填）: 是否还有更多数据等待加载，如果为 false 且数据已经全部渲染，则不会加载更多。如果为 true，则可以继续触发加载更多的回调函数
- loader（可选）: 加载更多数据时显示的组件
结语
以上就是关于 react-infinite-scrolling 的使用教程，希望对你有些帮助。在实际开发中，这个组件能够极大地方便数据的渲染。由于该组件并不是 react 内置的组件，所以需要安装相应的包进行引用。当然，如果你有更好的无限滚动组件，请不要吝啬，多贡献出来，让 React 生态更加丰富多彩。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005672081e8991b448e38c0