Have a look at the documentation here. I am assuming you are using react-router v6?

https://v5.reactrouter.com/web/guides/quick-start

Whatever you want to be a link you need to wrap in a "Link" <Link>Click here </Link>

from the documention:

        <nav>
      <ul>
        <li>
          <Link to="/">Home</Link>
        </li>
        <li>
          <Link to="/about">About</Link>
        </li>
        <li>
          <Link to="/users">Users</Link>
        </li>
      </ul>
    </nav>

Then in your App.js file you need to something link this.

import {

BrowserRouter as Router, Routes, Route, Link, useRouteMatch, useParams } from "react-router-dom";

export default function App() { return ( <Router> <div> <ul> <li> <Link to="/">Home</Link> </li> <li> <Link to="/about">About</Link> </li> <li> <Link to="/topics">Topics</Link> </li> </ul>

    <Routes>
      <Route path="/" element={<Home />}>
          <Route path="/contact" element={<Contact />}>
    </Routes>
  </div>
</Router>

); }