title: useParams() is empty in react-router
body: <p>I'm trying to render the params in the url as an h2 in in the website. But even when I try console.log useParams is empty.</p>
  <p>Here's my Router.js file</p>
  <pre><code>const Webpages = () =&gt; {
      return (
          &lt;Router&gt;
              &lt;Routes&gt;
                  &lt;Route exact path=&quot;/&quot; element={Home()} /&gt;
                  &lt;Route exact path=&quot;/comics&quot; element={Comics()} /&gt;
                  &lt;Route path='/comics/:comicId' element={Comic()} /&gt;  &lt;--------------
                  &lt;Route exact path=&quot;/portfolio&quot; element={Portfolio()} /&gt;
                  &lt;Route exact path=&quot;/blog&quot; element={Blog()} /&gt;
                  &lt;Route exact path=&quot;/contact&quot; element={Contact()} /&gt;
                  &lt;Route exact path=&quot;/store&quot; element={Store()} /&gt;
                  &lt;Route path=&quot;*&quot; element={NotFound()} /&gt;
              &lt;/Routes&gt;
          &lt;/Router&gt;
      );
  };
  
  export default Webpages;
  </code></pre>
  <p>Here's my comic component</p>
  <pre><code>import React from 'react';
  import NavBar from '../../components/NavBar';
  import { useParams } from 'react-router-dom';
  
  function Comic() {
      let { comicId } = useParams();
      console.log(comicId);
  
      return (
          &lt;div&gt;
              &lt;NavBar /&gt;
              &lt;p&gt;{comicId}&lt;/p&gt;
          &lt;/div&gt;
      )
  }
  
  export default Comic
  </code></pre>
  <p>The page element when I go to a random comic works fine, like <em>localhost:3000/comics/465456</em> but the <p> tag is empty and the console log is undefined, it's also undefined if I just try to console log useParams()</p>