How to set the DefaultRoute to another Route in React Router
You can use Redirect instead of DefaultRoute
<Redirect from="/" to="searchDashboard" />
Update 2019-08-09 to avoid problem with refresh use this instead, thanks to Ogglas
<Redirect exact from="/" to="searchDashboard" />
Source:
https://stackoverflow.com/a/43958016/3850405
Update:
For v6 you can do it like this with Navigate
. You can use a "No Match" Route to handle "no match" cases.
<Routes>
<Route path="/" element={<Navigate to="/searchDashboard" />}>
<Route path="searchDashboard" element={<SearchDashboard/>} />
<Route
path="*"
element={<Navigate to="/" />}
/>
</Route>
</Routes>
https://reactrouter.com/docs/en/v6/getting-started/tutorial#adding-a-no-match-route
https://stackoverflow.com/a/69872699/3850405
Original:
The problem with using <Redirect from="/" to="searchDashboard" />
is if you have a different URL, say /indexDashboard
and the user hits refresh or gets a URL sent to them, the user will be redirected to /searchDashboard
anyway.
If you wan't users to be able to refresh the site or send URLs use this:
<Route exact path="/" render={() => (
<Redirect to="/searchDashboard"/>
)}/>
Use this if searchDashboard
is behind login:
<Route exact path="/" render={() => (
loggedIn ? (
<Redirect to="/searchDashboard"/>
) : (
<Redirect to="/login"/>
)
)}/>