title: React Router: How to keep a param in the URL when clicking on a Link
body: <p>I'm using React Router v5.2 in my project. Browser Router looks like this:</p>
  <pre><code>&lt;BrowserRouter&gt;
    &lt;Navbar /&gt;
    &lt;Switch&gt;
      &lt;Route path={&quot;/sitemap&quot;, &quot;/sitemap/:param?&quot;} exact&gt;
        &lt;Sitemap /&gt;
      &lt;/Route&gt;
      &lt;Route path={&quot;/&quot;, &quot;/:param?&quot;} exact&gt;
        &lt;Home /&gt;
      &lt;/Route&gt;
      &lt;Route path=&quot;/&quot; render={() =&gt; &lt;div&gt;404&lt;/div&gt;} /&gt;
    &lt;/Switch&gt;
    &lt;Footer /&gt;
  &lt;/BrowserRouter&gt;
  </code></pre>
  <p>The Link to navigate:</p>
  <pre><code>&lt;Link to=&quot;/sitemap&quot;&gt;Sitemap&lt;/Link&gt;
  </code></pre>
  <p>Clicking the link obviously overwrites the param if my URL is like &quot;mysite.com/param&quot; this and turns it into &quot;mysite.com/sitemap&quot;. But my question is, how would I make it &quot;mysite.com/sitemap/param&quot; from the link? I tried adding the <code>history.location.pathname</code> when adding the link, but it would look like &quot;mysite.com/sitemap/sitemap/param&quot; if I press it again...</p>
  <p>And when clicking on the home button it should only show again &quot;mysite.com/param&quot;.</p>
  <p>Any help would be greatly appreciated!</p>