Skip to content

React Router: How to keep a param in the URL when clicking on a Link

I’m using React Router v5.2 in my project. Browser Router looks like this:

  <Navbar />
    <Route path={"/sitemap", "/sitemap/:param?"} exact>
      <Sitemap />
    <Route path={"/", "/:param?"} exact>
      <Home />
    <Route path="/" render={() => <div>404</div>} />
  <Footer />

The Link to navigate:

<Link to="/sitemap">Sitemap</Link>

Clicking the link obviously overwrites the param if my URL is like “” this and turns it into “”. But my question is, how would I make it “” from the link? I tried adding the history.location.pathname when adding the link, but it would look like “” if I press it again…

And when clicking on the home button it should only show again “”.

Any help would be greatly appreciated!


You can use useParams() to save params and pass it to other link.

Please refer this link to test the URL.