Реагировать на вложенные маршруты маршрутизатора с точным путем

Question

Пожалуйста, помогите. Я пытаюсь создать вложенные маршруты, но вот проблема: если я использую exact path, у меня не может быть вложенных маршрутов.

Например, я хочу иметь один вложенный маршрут и один отдельный . Мне нужно использовать exact, если я хочу иметь индивидуальный. Как я могу получить оба?

  <Route exact path="/projects" component={Projects} />

  <Route path="/projects/individual" component={ProjectsList} />
  <Route path="/projects/nested" component={ProjectsList} />

Вот коды и ящик .

Answer 1

Вы правы, с точным атрибутом вы теряете гибкость в использовании вложенных маршрутов. Решение здесь состоит в том, чтобы использовать Switch и упорядочить свои маршруты таким образом, чтобы пути префиксов находились в конце

<Switch>
  <Route path="/projects" component={Projects} />
  <Route path="/" component={Home} />
</Switch>

---

, а внутри проектов вы можете писать вложенные пути

<Route path="/projects/individual" component={ProjectsList} />
<Route path="/projects/nested" component={ProjectsList} />

Обновление:

Однако, если в компоненте ProjectsList, то есть в путях "/projects/individual" и "/projects/nested", вы не хотите отображать компонент Projects, вы должны использовать их как

<Switch>
  <Route path="/projects/individual" component={ProjectsList} />
  <Route path="/projects/nested" component={ProjectsList} />
  <Route path="/projects" component={Projects} />
  <Route path="/" component={Home} />
</Switch>