Scroll on bottom

[brunoqs]

How can i use this lib to know if the scroll is in the bottom of page

[n8tb1t]

I'll come back to you with some example a bit later, in general, you need to measure the total scroll height and the scroll position if they are equal it means we reached the end of the page...

[lukebelbina]

In case this is useful here's what I ended up doing:

const [isBottom, setIsBottom] = React.useState(false);
 useScrollPosition(({ prevPos, currPos }) => {
 	// todo cache the page height
        if (!isBottom && currPos.y * -1 === document.body.offsetHeight - window.innerHeight) {
            setIsBottom(true);            
            // do my code here which includes loading more data from a webservice
        } else {
            setIsBottom(false);
        }
    });

[kantmichel]

To add to @KBelbina's reply. Here's what i did to cache the page height on page load:

const [pageHeight, setPageHeight] = useState() 

  useEffect(() => {
    setPageHeight(
      document.documentElement.scrollHeight -
        document.documentElement.offsetHeight
    )
  }, [])

I think currPos.y measures the top of the screen view. Not the bottom, so hence the offsetHeight so that you can check if someone scrolled all the way down.