Как сделать перенаправление во вложенных маршрутах с помощью React Router

Question

После входа в систему мое приложение перенаправляет в / admin / dashboard, а при вводе пути к панели мониторинга я хочу, чтобы мое приложение загрузило первый компонент и перенаправило в / admin / dashboard / profile. В компоненте App. js у меня есть код

<Router>
    <Layout>
      <Navbar />
      <Switch>
        ...
        <Route exact path="/admin/dashboard" component={Dashboard}/>
        ...
      </Switch>
    </Layout>
  </Router>

В компоненте у меня есть код

    <Layout>
      <Sidebar />
      <Switch>
        <PrivateRoute path={`${match.url}/profiles`} component={Profiles} />
        <PrivateRoute path={`${match.url}/tests`} component={Tests} />
        <PrivateRoute path={`${match.url}/settings`} component={Settings} />
      </Switch>
    </Layout>

Он загружает компонент только тогда, когда путь первого компонента - это путь = {${match.url}/ }, но когда путь равен / admin / dashboard / profile, он не отображает компонент Profiles. Что я делаю не так?

Answer 1

Вы используете точный атрибут на маршруте верхнего уровня

<Route exact path="/admin/dashboard" component={Dashboard}/>

Именно поэтому любой вложенный маршрут не будет совпадать. Удалите точный атрибут из родительского маршрута, и он будет работать для вас

<Route path="/admin/dashboard" component={Dashboard}/>

Также для путей вы должны использовать match.path вместо match.url. match.url следует использовать для Link и Redirect компонента