title: Smooth scroll not working with react-router-hash-link
body: <p>I updated react-router to v6 and now when I add smooth to the HashLink it doesn't even scroll.</p>
  <pre class="lang-json prettyprint-override"><code>    &quot;react-router&quot;: &quot;^6.2.1&quot;,
      &quot;react-router-dom&quot;: &quot;^6.2.1&quot;,
      &quot;react-router-hash-link&quot;: &quot;^2.4.3&quot;,
  </code></pre>
  <p>So I tried to change for a simple <code>a href</code> and add <code>scroll-behavior:smooth</code> in css but it doesn't work either.</p>
  <pre class="lang-html prettyprint-override"><code>           &lt;div className=&quot;navbar__center&quot;&gt;
                  &lt;nav&gt;
                      &lt;HashLink smooth to=&quot;/#home&quot;&gt;
                          Home
                      &lt;/HashLink&gt;
                      &lt;HashLink smooth to=&quot;/#about&quot;&gt;
                          About
                      &lt;/HashLink&gt;
                      &lt;HashLink smooth to=&quot;/#works&quot;&gt;
                          Works
                      &lt;/HashLink&gt;
                  &lt;/nav&gt;
              &lt;/div&gt;
  </code></pre>
  <p>So ofc in the same page I have this:</p>
  <pre class="lang-html prettyprint-override"><code>&lt;section className=&quot;home__section home__2&quot; id=&quot;about&quot;&gt;
  </code></pre>
  <p>I can see the hash anchor tag in the url and it will navigate to it if a open it in a new tab but that's all.</p>
  <p>The routes:</p>
  <pre class="lang-js prettyprint-override"><code>     &lt;BrowserRouter&gt;
          &lt;main className=&quot;main&quot;&gt;
            &lt;Routes&gt;
  
              &lt;Route path=&quot;/&quot; element={&lt;Home /&gt;}&gt;
              &lt;/Route&gt;
  
              &lt;Route path=&quot;*&quot; element = {&lt;FourOhFour/&gt;} /&gt;
            
            &lt;/Routes&gt;
          &lt;/main&gt;
        &lt;/BrowserRouter&gt;
  </code></pre>