React:访问父路由时使子路由的地址处于活动状态?

React: Make child route's address active when visiting parent?

我有如下所示的嵌套路由:

<Route path='parent' component={Parent}>
    <Route path='child1' component={Child1}/>
    <Route path='child2' component={Child2}/>
    <Route path='child3' component={Child3}/>
</Route>

当您访问 /parent 时,我正在努力做到这一点,您将被重定向到 /parent/child1。我已经尝试在 Child1 组件上使用 React-Router 中的 IndexRoute,但这只会在您访问 /parent 时使 Child1 成为组件。我错过了什么?

您可以为此使用 IndexRedirect 组件。

<Route path='parent' component={Parent}>
    <IndexRedirect to="/child1" />
    <Route path='child1' component={Child1}/>
    <Route path='child2' component={Child2}/>
    <Route path='child3' component={Child3}/>
</Route>