Window.scrollTo is undefined in React

Question

I want to do a simple window.scrollTo(0,0) on a button click. I want it to just move the window to the top. Unfortunately the window.scrollTo(0,0) does nothing with the GUI.

I suspect it has something to do with React and the structure of the application.

scrollToTop: function() {
    window.scrollTo(0, 0);
}

Do I have to do it in another way with react or is there something I have missed?

Answer 1

I found that the problem was that I had a fixed position on my main container.

main-container {
   position: fixed; // Should use either static or relative
}

This made the window keep its position "fixed", which meant that window.scrollTo()would not change the position.

So be careful using position: fixed;unless you want the element to stick in the viewport. (like a header)