react-use-infinite-scroll-list
React hooks - Infinite Scroll List powered by IntersectionObserver
🎊 Install
npm install react-use-infinite-scroll-list
📝 Usage
; const YOUR_COMPONENT = { // hooks initialize const items setItems = ; const InfiniteScrollList = ; // init : fetch first data { return { ; }; } // more : fetch more data when scrolling to bottom of list { return { ; }; } return <> <InfiniteScrollList> <YourListComponent items=items /> </InfiniteScrollList> </> ;};
🔧 Props
init
: a callback function to fetch first-page data. you should return a Promise resolve withisDone
value.more
: a callback function to fetch more data when scrolling to the end of list. you should return a Promise resolve withisDone
value.loadingElement
: (optional) JSX Component to display on a bottom of list while executingmore
callback