CODEWITHSUNDEEP
reactjsreact-router
Endrit Shabani
Endrit Shabani

Reputation: 35

No routes matched path

Hi there I'm trying to create an admin panel for my project, I have this code where I render the front end for the user, and for the admins

<div className="App">
  <Router>
    <Routes>
      <Route path='/admin-panel' exact  element={<BackEnd/>} />
    </Routes>
    <Routes>
      <Route path="/" element={<FrontEnd />}></Route>
    </Routes>
  </Router>
</div>

On my BackEnd Component I have this code

 <div>
        <Header />
        <div className='panel'>
            <SideBar />
            <Routes>
                <Route path='admin-panel/add-product/' element={<AddProduct/>} />
            </Routes>
        </div>
    </div>

So I want to create, when ever I click on my sidebar list, to render my pages, for this example my AddProduct View,

THanks a lot;

Upvotes: 1

Views: 101

Answers (1)

Drew Reese
Drew Reese

Reputation: 203408

If Backend is rendering nested sub-routes then the parent path needs to specify that it can match nested routes. Use the * wildcard.

<div className="App">
  <Router>
    <Routes>
      <Route path='/admin-panel/*' element={<BackEnd/>} />
      <Route path="/" element={<FrontEnd />} />
    </Routes>
  </Router>
</div>

Upvotes: 1

Related Questions