reactjs - React 路由器匹配失败

Question

与 Router 组件相比，使用 react-router 中的 Match 和 Miss 组件有什么优势？我似乎在 react-router docs 中找不到任何关于此的文档.

我的问题源于查看 react-universally更准确地说，请查看此处的样板:https://github.com/ctrlplusb/react-universally

Answer 1

<Match>和<Miss>是 React Router v4 alpha 版本中的组件。

在测试版中，<Match>已更名为<Route> (它的 props 已经改变， pattern 现在是 path ， exactly 是 exact )。 <Miss>组件被完全删除。相反，您应该使用 <Switch>语句，它只会渲染第一个 <Route> (或 <Redirect> )匹配。您可以添加无路径组件作为 <Switch> 的最后一个子组件。的路线，当没有前面的 <Route> 时它将渲染匹配。

您可以查看API documentation了解更多详情。

<Switch>
  <Route exact path='/' component={Home} />
  <Route path='/about' component={About} />
  // The following <Route> has no path, so it will always
  // match. This means that <NoMatch> will render when none
  // of the other <Route>s match the current location.
  <Route component={NoMatch} />
</Switch>