React Router redirect IndexRoute to proper path

Question

I'm trying to configure React Router so that when accessing http://url/manage/roomId it goes directly to http://url/manage/roomId/sessions (loading RoomSessions component). These are tabs components' routes and I want to load the first tab's content (which it does) by default with the proper URL (which it does not).

It works fine except for the redirection

<Route
    path="manage/:roomId"
    component={RoomsManagerManageRoom}
    onEnter={requireAuth}
>
    <IndexRoute component={RoomSessions} onEnter={requireAuth} />
    <Route path="sessions" component={RoomSessions} onEnter={requireAuth} />
    <Route path="meetings" component={RoomMeetings} onEnter={requireAuth} />
    <Route path="files" component={RoomFiles} onEnter={requireAuth} />
    <Route path="recordings" component={RoomRecordings} onEnter={requireAuth} />
    <Route path="sections" component={RoomSections} onEnter={requireAuth} />
    <Route path="hosts" component={RoomHosts} onEnter={requireAuth} />
</Route>

What am I missing?

Where did you set up the redirect you're talking about? – ostrgard Mar 02 '16 at 22:33 — ostrgard, Mar 02 '16 at 22:33

rguerrettaz · Accepted Answer · 2016-03-03T00:39:38.443

12

Replace the <IndexRoute /> line with

<IndexRedirect to="sessions" />

edited Mar 03 '16 at 00:39

answered Mar 02 '16 at 23:07

rguerrettaz

836
8
12

Thanks, I have to replace IndexRoute with IndexRedirect ... correct your answer and I will accept it. – Gab Mar 02 '16 at 23:10

React Router redirect IndexRoute to proper path

1 Answers1