yarn add react-infinite-scroll-list Note: This library is based on the IntersectionObserver API, it's not yet widely supported. Check the compatibility table and add a Polyfill to your needs!
Check out the example on Storybook
Import the module in your application:
// From ES6 import InfiniteList from 'react-infinite-scroll-list'; // From CJS const InfiniteList = require('react-infinite-scroll-list').default; // From global const InfiniteList = ReactInfiniteScrollList.default;Then use it juste like that:
<InfiniteList root="container|viewport" isLoading={true | false} isEndReached={true | false} onReachThreshold={() => { console.log('Load more content'); }} containerClassName="custom-container-class-name" sentinelClassName="custom-sentinel-class-name" containerTagName="div" sentinelTagName="div" threshold={0} > {items.map(item => <div key={item.id}>{item.message}</div>)} </InfiniteList>yarn start-storybook yarn build-storybook yarn test