React Router v4呈现多个路由

Question

我正在创建SPA，并尝试使用react-router-dom软件包版本在应用程序中设置“路由” 4.1.1。

我的路线定义如下：

<BrowserRouter>
  <div>
    <Route exact path="/" component={Login} />
    <Route path="/login" component={Login} />
    <Route path="404" component={NotFound} />
    <Route path="*" component={NotFound} />
  </div>
</BrowserRouter>

基本上，我想设置路由，以便对未定义路由的页面的任何请求都转到{NotFound}组件。

如何做到这一点？上面的解决方案在请求页面时同时呈现Login和NotFound组件/login。

亲切的问候

Answer 1

这是官方教程中的示例，如何避免呈现多条路线

import { Switch, Route } from 'react-router

    <Switch>
      <Route exact path="/" component={Home}/>
      <Route path="/about" component={About}/>
      <Route path="/:user" component={User}/>
      <Route component={NoMatch}/>
    </Switch>