React 路由器 v4 阻止匹配子路由答案

【问题标题】：React router v4 prevent matching child routesReact 路由器 v4 阻止匹配子路由
【发布时间】：2018-03-31 06:09:29
【问题描述】：

我遇到了 React Router v4 Switch 组件的问题。我很惊讶我找不到这个问题的相关线程。一个普通的 Switch 如下所示：

<Switch>
  <Route path='/path1' component={Path1Component}/>
  <Route path='/path2' component={Path2Component}/>
  <Route exact path='/' component={Home}/>
  <Route component={NotFound}/>
</Switch>

这意味着当我在路径上时：“/”我得到一个 Home 组件，在“/path1”上我得到一个 Path1Component，在路径“/foobar”上我得到一个 NotFound 组件。这很好

但是，当我在“/path1/foobar”路线上时，我也得到了 Path1Component。这种行为并非在每种情况下都是正确的——这次我不希望任何嵌套路由用于 '/path1' 路由。 '/path1/foobar' 应该得到一个 NotFound 组件，任何字符串，无论在 '/path1' 之后是否带有 '/' 都应该返回 NotFound 组件。

解决此问题的首选方法是什么？我可以精确地添加到每条路径，但这不会过度膨胀代码吗？我觉得这应该是默认值，但事实并非如此。

即使在 React Router v4 文档中，例如 here。我看到了这个问题 - 这里 '/will-match/foo' 也将匹配。你都有些什么想法呢？

【问题讨论】：

标签： javascript reactjs nested switch-statement router

【解决方案1】：

有一个讨论 here，但简而言之：它会破坏现有代码。如果要改变这种情况，如果您想匹配子路由而不执行“path1/child1”，则必须执行exact={false}。

【讨论】：