Вопрос прост, и я не нашел соответствующих настроек для моего.
Итак, песочница ссылка переходит к актуальной проблеме.
Теперь я буду кратко.
Если перейти к root/term/
, а затем к компоненту Route 2 из приложения в ссылке «Песочница» и, наконец, нажать refre sh, компонент исчезнет. Все, что у меня осталось, это AppHeader.
Причина в том, что сопоставление маршрута происходит в Компоненте App.tsx
, и оно не находит соответствующего соответствия. Достаточно справедливо!
Я могу противостоять этому, добавляя указанные маршруты на уровне root, а также выравнивая их все.
Что-то вроде
<Route path="/root/term/" />
<Router path="/root/term/route1" />
<Route path="/root/term/route2" />
Но мой вопрос в том, что если мне действительно нужно использовать динамическую c маршрутизацию с вложенными маршрутами, я не должен добавлять все маршруты в одном месте (root т.е. приложение здесь). Это то, что React router 4 предпочитает нам делать.
Единственная проблема возникает в случае ссылки sh.
При поиске Появляется распространенное решение для обнаружения refre sh и предотвращения перезагрузки. Но даже это API является экспериментальным -
Так что будет лучшим решением для подхода к динамической c, декларативной и вложенной маршрутизации в React router 4, содержащей страницу refre sh и, возможно, перенаправить к непосредственному родителю, если refre sh произойдет?
В этом случае я бы хотел перенаправить на /root/term
, когда обновляются любые из маршрутов 1, 2, 3 в term
.
Надеюсь, я прояснил свой вопрос!
Обновление - ответ @ Нгуена указал мне правильное направление. Требуется только одно изменение: удалить exact
из родительского <Route path="/term" />
. Дочерние маршруты все еще могут иметь точное совпадение.
Обновлено Ссылка в песочнице
Хорошее обучение для exact
возможно.