Question

<Route exact path='/admin/task/create' component={ComponentA} /> <Route exact path='/admin/task/:id' component={ComponentB} />

我访问http://localhost:3000/task/123它会触发ComponentB，但当我点击http://localhost:3000/task/create时会触及ComponentB和ComponentA，为什么会这样？我认为确切的道具可以解决这个问题吗？

Answer 1

我认为你的路由器彼此独立，所以第二个路由器接收“create”为：id。

您必须使用Switch

包装路由器

<Switch>
    <Route exact path='/admin/task/create' component={ComponentA} />
    <Route exact path='/admin/task/:id' component={ComponentB} />
</Switch>

https://github.com/ReactTraining/react-router/blob/master/packages/react-router/docs/api/Switch.md

反应路由器v4精确道具触发器2组件

1 个答案: