reactjs - 开关是做什么的？

Question

我有以下代码:

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

<Route exact path="/" component={Landing} />
<div className="container">
  <Route path="/register" render={() => (
    <Register {...this.props} />
  )}/>
  <Route path="/login" render={() => (
    <Login {...this.props}/>
  )}/>
  <Switch>
    <PrivateRoute path="/dashboard" component={Dashboard}/>
  </Switch>
  <Switch>
    <PrivateRoute path="/create-profile" component={CreateProfile}/>
  </Switch>

用户登录(使用 /login )后，他被重定向到 /dashboard 。但是，如果我删除 <Switch>来自/dashboard ，用户仍被重定向到 /dashboard但那个Dashboard组件不会被渲染。

那么 <Switch> 到底是怎么做到的呢？工作？

Answer 1

删除 Switch 会将登录和仪表板组件呈现为直接子组件。登录后，您将被重定向到“/dashboard”url，但仪表板不会重新呈现，因为两个路由都匹配此路径。

Switch 组件专门渲染与当前 url 匹配的第一个子路径。