Each time the scroll event fires, the state updates, the hook function gets called again with the latest state and returns the scroll offset to the calling component.
When the hook re-runs and returns the scroll offset to the calling component. How's the component picking up the new change? The re-run/re-render happened inside the hook only in this case.
By design, React uses memory cells to store the state for the component instance. Does this apply to custom hooks too? If yes, then it makes sense. The custom hook will return a value, the scrollPosition local state changes inside the corresponding memory cell, this causes the component to trigger a self re-render.
Thank you
Bilal Haidar
For further actions, you may consider blocking this person and/or reporting abuse
We're a place where coders share, stay up-to-date and grow their careers.
Very helpful article! Thanks.
I have a question related to this paragraph:
When the hook re-runs and returns the scroll offset to the calling component. How's the component picking up the new change? The re-run/re-render happened inside the hook only in this case.
By design, React uses memory cells to store the state for the component instance. Does this apply to custom hooks too? If yes, then it makes sense. The custom hook will return a value, the scrollPosition local state changes inside the corresponding memory cell, this causes the component to trigger a self re-render.
Thank you
Bilal Haidar