Skip to content

Instantly share code, notes, and snippets.

@Dev4ster
Created October 12, 2023 13:46
Show Gist options
  • Save Dev4ster/72c70204e49b9f1842bdd870b6ebc272 to your computer and use it in GitHub Desktop.
Save Dev4ster/72c70204e49b9f1842bdd870b6ebc272 to your computer and use it in GitHub Desktop.
Reactjs div with scroll tigger onEndReached event / Detect scroll end
useEffect(() => {
const listElement = refElement.current; // this is a ref that you need to pass to your html element that contains scroll
if (listElement) {
listElement.onscroll = () => {
const bottom = listElement.scrollHeight - listElement.scrollTop === listElement.clientHeight;
if (bottom) {
onEndReached(); // it is a prop you can change per a inside component method
}
};
return () => {
listElement.onscroll = () => {};
};
}
}, [refElement, onEndReached]);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment