No routes matched location "/wear"

Question

I am developing a simple React application. I get the error "No routes matched location "/wear". What am I doing wrong?

App.js:

import { Routes, Route } from "react-router-dom";
import Wear from "./pages/Wear";

function Header() {
  return (
    <>
      <li className="nav-item">
        <a className="whiteNavbar nav-link active" href="/wear">
          Одежда
        </a>
      </li>
      <Routes>
        <Route path="/wear " exact element={<Wear />} />
      </Routes>
    </>
  );
}

export default Header;

Wear.js:

      <div className="productTitle d-flex justify-content-between">
        <div className="cardText">Толстовка з капюшоном Polar No Complies Forever</div>
        <div className="cardPrice">UAH 3 600</div>
      </div>
    </div>
  );
};

export default Wear;

You should use `Link` instead of `a`. Also, remove that additional space after `wear` in your rotuer. — Konrad, Aug 30 '22 at 11:41
Please edit your post to include a complete and comprehensive [mcve] so we can see what the code is doing. Please include the router and root routes and what/how these components are rendered. — Drew Reese, Aug 30 '22 at 15:33

score 0 · Answer 1 · edited Mar 25 '23 at 16:58

0

Try this structure for you router:

<BrowserRouter>
    <Routes>
        <Route path="register" element={<RegisterPage />} />
    </Routes>
</BrowserRouter>

edited Mar 25 '23 at 16:58

Ahmed Sbai

10,695
9
19
38

answered Aug 30 '22 at 11:53

Mikka

24
2

No routes matched location "/wear"

1 Answers1