Как создать путь `/ orders /: id / detail` в реагирующий маршрутизатор

Question

Я хотел бы создать путь /orders/{order_id}/detail, используя реагирующий маршрутизатор. Как это сделать на компоненте <Route />, а также при использовании <Link /> для перехода к пути.

В настоящее время у меня это так:
<Route exact path='/orders/:id' component={OrderDetails} />

, но Я хочу вот так
<Route exact path='/orders/:id/detail' component={OrderDetails} />

Любая помощь приветствуется.

Answer 1

этот маршрут:

<Route exact path='/orders/:id/detail' component={OrderDetails} />

правильный, он будет отображать компонент OrderDetails на этом URI:

/orders/whatEverId/details

точка - это навигация к этому URL для отображения этот компонент, для этого вам нужно знать, что каждый компонент, который отображается с реагирующим маршрутизатором напрямую, имеет три дополнительных реквизита, location, match и history, и вы можете получить их из this.props автоматически, если вы используете класс на основе компонентов, если вы используете компонент функции, вам нужно использовать их ловушку, называемую useParams ловушкой, которую react-router предоставляет, и деструктурировать нужный вам параметр из URL.

дополнительная информация здесь