React Router 动态路径与固定路径答案

【问题标题】：React Router dynamic path vs fixed pathReact Router 动态路径与固定路径
【发布时间】：2022-07-12 01:14:39
【问题描述】：

我有 2 个类似这样的 URL 模式。

第一个看起来像这样。

 <Route path="/app1/pages/home" element={<Home />} />

然后，我有另一条看起来像这样的路线。

<Route path="/:app/:pages/:page" element={<Dynamic />} />

当用户访问“/app1/pages/home”时，他们会被定向到Dynamic而不是Home

我知道这样做是因为我有一个使用 : 定义的动态路由，但是如果用户正在访问的 URL 与定义的确切路由匹配，是否有办法覆盖并将用户重定向到 Home在路径中，即/app1/pages/home

【问题讨论】：

【解决方案1】：

您可能需要首先拥有Home 路由，但将exact 属性添加到Route。这将确保您的路由器首先查看/app1/pages/home 路径，如果不是完全匹配，它将继续查找下一个路径匹配。

像这样：

<Route exact path="/app1/pages/home" element={<Home />} />
<Route path="/:app/:pages/:page" element={<Dynamic />} />

【讨论】：