Question

在location的{{3}}中，它说：

最后，您可以将位置传递给以下组件：路由交换机

这将阻止他们使用路由器状态中的实际位置。这对于动画和待定导航非常有用，或者您想要将组件欺骗渲染到与真实组件不同的位置时。

有没有人知道以上的例子？

Answer 1

通知location属性。

<Switch location={this.props.location}>
  <Route exact path="/" component={Home}/>
  <Route path="/users" component={Users}/>
  <Redirect from="/accounts" to="/users"/>
  <Route component={NoMatch}/>
</Switch>

// ...

<Route location={this.props.location} path="/" component={Home}/>

可以接受从React-Router返回的任何位置对象，从而允许您例如快照最近的已知位置并有条件地再次使用它，例如用于执行适当的动画。

用于匹配子元素的位置对象，而不是当前历史记录位置（通常是当前浏览器URL）。

Switch location docs

一个元素试图将其路径与当前历史记录相匹配   位置（通常是当前浏览器的URL）。但是，具有   也可以传递不同的路径名进行匹配。

此功能在您需要将a与位置匹配时非常有用   除了   当前历史记录位置，如动画过渡中所示   例子。

如果元素包含在中，并且与   传递到的位置（或当前历史记录位置），   那么传递给的位置道具将被一个   （在此处使用）。

Route location docs

React Router v4将位置传递到路由

1 个答案: