Scroll on component update - React Hooks

1

Hey guys, I am having some trouble implementing this code into hooks:

  componentDidUpdate() {
    window.scrollTo(0, 1)
  }

It properly scrolled to the top on a re-render and worked as intended. I’m now looking through useRef, createRef, and it having to be inside useEffect, just a bit confused on where to go now. Do I have to reference state now? Thanks!

2

Have you read React Hooks Scroll to Element yet? it may help some.

3

I began to. I’ll keep combing through. Ah yes, I want to see if possible without react-router.

4

So without updating the location.hash, presumably. Hmm… Let me play a little, see what I can find. Haven’t had as much hooks experience as I’d like, you may have just given me my excuse. :wink:

1 Like
5

No worries! It’s frustrating that little amount of code worked perfectly in “old” React.

6

This seems to help but I might have to do a little configuring to behave how I want:

  useEffect(() => {
    document.getElementById('testId').scrollIntoView({ behavior: "smooth" })
  }, [])
1 Like