reactjs - 可选路径 React Router 4

Question

如何使用 Route 匹配可选路径React Router 4 中的组件？

例如我有一个 Orders我想在/account 和/account/orders 上呈现的组件。

相当于有两个 Route 组件来匹配两条路径。

<Route exact path="/account" component={Orders} />

<Route exact path="/account/orders" component={Orders} />

Answer 1

您可以在 react-router 4 上使用路径参数可选，如下所示:

<Route exact path="/account" component={Orders} />

<Route exact path="/account/orders?" component={Orders} />

因此，要将参数定义为可选，您需要添加尾随问号 (?)。同样对于多个可选参数:

<Route path="/account/:pathParam1?/:pathParam2?" component={Orders} />