react-custom-scrollbars icon indicating copy to clipboard operation
react-custom-scrollbars copied to clipboard

how can i know that i scroll to the end?

Open lemondreamtobe opened this issue 5 years ago • 5 comments

According to the api's doc, i do not find any apis which can support me to listen the moment of scrolling to the end?

lemondreamtobe avatar Mar 31 '20 09:03 lemondreamtobe

Yo ! I faced this issue, and this is how I resolved : :

const scrollbar = useRef(null);

const handleScrollAtBottom = () => {
   const { scrollTop, scrollHeight, clientHeight } = scrollbar.current.getValues();
   if (Math.round(scrollTop + clientHeight) >= scrollHeight)
      console.log('i am at bottom');
}

<Scrollbars ref={scrollbar}>
</Scrollbars>

okansoy avatar Apr 06 '20 12:04 okansoy

Yo ! I faced this issue, and this is how I resolved : :

const scrollbar = useRef(null);

const handleScrollAtBottom = () => {
   const { scrollTop, scrollHeight, clientHeight } = scrollbar.current.getValues();
   if (Math.round(scrollTop + clientHeight) >= scrollHeight)
      console.log('i am at bottom');
}

<Scrollbars ref={scrollbar}>
</Scrollbars>

3q! before get your mail, i had solved that problem by the same method

lemondreamtobe avatar Apr 07 '20 12:04 lemondreamtobe

there is an onScrollFrame callback, which will give you a value.top = 1 at the end of the scroll. No need for acrobatics :)

itshallrun avatar Jun 27 '20 22:06 itshallrun

there is an onScrollFrame callback, which will give you a value.top = 1 at the end of the scroll. No need for acrobatics :)

nice!

lemondreamtobe avatar Jun 28 '20 07:06 lemondreamtobe

const { scrollTop, scrollHeight, clientHeight } = scrollbar.current.getValues(); if (Math.round(scrollTop + clientHeight) >= scrollHeight) console.log('i am at bottom');

This is more reliable than the onScrollFrame

dpatra avatar Dec 02 '23 06:12 dpatra