react-infinite-scroll-reverse v2.0.2

REACT INFINITE SCROLL REVERSE COMPONENT

How to use

import InfiniteScrollReverse from "react-infinite-scroll-reverse";

In your component

const [isLoading, setIsLoading] = useState(true);
const [itemsList, setItemsList] = useState([]);
const itemsListTotal = 100500;

function getItems(page) {
  setIsLoading(true);
  setTimeout(() => {
    setItemsList(prev => ([...prev, { id: `uniq${page}`, name: "Alex" }]));
    setIsLoading(false);
  }, 300)
}

useEffect(()=>{
  getItems(1);
}, [])

  
<InfinteScrollReverse
  className="itemsContainer"
  hasMore={itemsList.length < itemsListTotal}
  isLoading={isLoading}
  loadMore={getItems}
  loadArea={30}
>
  {itemsList.map(item => (
    <div key={item.id}>{item.name}</div>
  ))}
</InfinteScrollReverse>

Props