摘要：
一个无限的滚动，实用的工作和超级简单的集成！如果需要下拉功能refreshFunction={this.refresh}pullDownToRefreshfullDownToRefreshContent={↓ 下拉刷新｝releaseToRefreshContent＝｛˂h3style＝｛｛textAlign:‘center‘｝｝＞↑ Releasetorefresh}˃{items}此InfiniteScrall组件可通过三种方式使用。如果可滚动内容显示在提供溢出滚动条的父元素中，则可以支持scrollableTarget引用DOM元素并使用其滚动条获取更多数据。滚动将发生在文档的时间轴滚动上，而不是设置高度或可滚动目标道具。就像Facebook一样。
使用一个组件，让你所有的无限滚动的痛苦消失，只有4.15kB！Pull Down to Refresh新增功能。一个无限的滚动，实际工作和超级简单的集成！
安装
npm install --save react-infinite-scroll-component
// in code ES6
import InfiniteScroll from 'react-infinite-scroll-component';
// or commonjs
var InfiniteScroll = require('react-infinite-scroll-component');
<InfiniteScroll
dataLength={items.length} //This is important field to render the next data
next={fetchData}
hasMore={true}
loader={<h4>Loading...</h4>}
endMessage={
<p style={{textAlign: 'center'}}>
<b>Yay! You have seen it all</b>
</p>
}
// below props only if you need pull down functionality
refreshFunction={this.refresh}
pullDownToRefresh
pullDownToRefreshContent={
<h3 style={{textAlign: 'center'}}>↓ Pull down to refresh</h3>
}
releaseToRefreshContent={
<h3 style={{textAlign: 'center'}}>↑ Release to refresh</h3>
}>
{items}
</InfiniteScroll>
这个InfiniteScroll组件可以通过三种方式使用。 为height如果你想要你的道具可滚动内容具有特定高度，提供滚动条以滚动内容并获取更多数据。 如果你可滚动内容呈现在已提供溢出滚动条的父元素中，可以将scrollableTarget支持引用DOM元素并使用它的滚动条获取更多数据。 而不设置height或scrollableTarget道具，滚动将发生在document.body喜欢Facebook的时间轴卷轴。
例子 使用Reaction(主体/窗口滚动)的无限滚动(永不结束)示例 https://codesandbox.io/s/yk7637p62z 无限滚动至500元素(主体/窗口滚动) https://codesandbox.io/s/439v8rmqm0 元素中的无限滚动(高度400 px的div) https://codesandbox.io/s/w3w89k7x8 无限滚动scrollableTarget(可滚动的父元素) https://codesandbox.io/s/r7rp40n0zm
API 请转https://github.com/ankeetmaini/react-infinite-scroll-component