CODEWITHSUNDEEP
react-routerreact-router-redux
Sasha Kos
Sasha Kos

Reputation: 2608

Is there a way to define default route (if no one match) in [email protected]

Im using [email protected]

I have this

<Route path='/login' component={ Login } />
<Route exact path='/' component={ Home } />

Is there a way to define default route as in [email protected]?

It is also necessary this "default route" does not pass if any other matched.

Because if I will add 

<Route path='/login' component={ Login } />
<Route exact path='/' component={ Home } />
<Route component={ Default } />

Default component will be rendered for all routes, including '/login' and '/'

Upvotes: 3

Views: 8333

Answers (3)

shehan chanuka
shehan chanuka

Reputation: 141

With latest react-router version,

<Route path='' Componenet={Default}>

should be changed to,

<Route path='' element={<Default>}>

Upvotes: 0

Mikser
Mikser

Reputation: 989

I was looking for answer for the same problem but for react-router-dom package. The solution was this:

<Switch>
  <Route path='/login' component={ Login } />
  <Route exact path='/' component={ Home } />
  <Route component={ Default } />
</Switch>

This way the first Route that matches will be displayed while the rest ignored.

You can import Switch together with Route like this:

import { BrowserRouter, Switch, Route } from 'react-router-dom';

Upvotes: 3

John
John

Reputation: 3296

Place the following catch-all route after all other routes are defined (optionally leave the path out as stated below):

<Route path="*" component={DefaultRoute} />

Here's a link to an answer with more details: React-Router: No Not Found Route?

Upvotes: 0

Related Questions