Question

我有以下两条路线：/items和/items/buy。

每条路线对应一个视图中的一个标签。两条路线都使用精确道具进行渲染，但在导航到/items/buy时，仍会将两个标签标记为活动。

我已尝试使用withRouter，但我注意到将/items更改为/items/sell可以解决问题，但我不想拥有这条路线。

我理解rrv4与我的路线/items的第一部分匹配，而另一条路线也匹配/items/buy，但我认为如果我使用{{{{}}我不应该这样做1}}。关于为什么会发生这种情况的任何线索？

啊，我忘了说我已经在使用Switch了。

感谢您的帮助！

Answer 1

您需要将路线放在<Switch>组件中。该开关仅呈现匹配的第一条路线。

import {Route, Switch} from 'react-router-dom';

<Switch>
  <Route exact path="/" component={Main} />
  <Route exact path="/items" component={SomeComponent} />
  <Route exact path="/items/buy" component={SomeOtherComponent} />
  <Route component={NotFound} />
</Switch>

Answer 2

问题是我用LinkContainer包装一个NavItem而LinkContainer没有一个确切的道具。添加确切的道具解决了这个问题！

如何防止使用react-router v4匹配两条路由？

2 个答案: