title: React-router v6 window.scrollTo does not work
body: <p>I am trying to fix the scrolling issue in React wherein when I was to scroll down to a certain point on the page, and then navigates to another page, that page will begin at the same scroll point as the previous page.</p>
  <p>Here's what I tried:</p>
  <pre><code>import { useLocation } from 'react-router'
  
  const ScrollToTop: React.FC = () =&gt; {
    const { pathname } = useLocation()
    React.useEffect(() =&gt; {
      console.log('im scrolling')
      window.scrollTo(0, 0)
    }, [pathname])
  
    return null
  }
  
  export default ScrollToTop
  </code></pre>
  <p>And then imports it like this:</p>
  <pre><code>import React from 'react'
  import ReactDOM from 'react-dom'
  
  import { BrowserRouter } from 'react-router-dom'
  
  import ScrollToTop from './components/base/ScrollToTop'
  import Apps from './App'
  
  ReactDOM.render(
    &lt;BrowserRouter&gt;
      &lt;ScrollToTop /&gt;
      &lt;Apps /&gt;
    &lt;/BrowserRouter&gt;,
    document.getElementById('root'),
  )
  </code></pre>
  <p><em>Im scrolling</em> is printing in the console but the <em>window.scrollTo</em> is not working.<br />
  I also tried the <em>useLayoutEffect</em>, but the same result still not scrolling.</p>