javascript - React 路由组件处理所有 "/"路由，除了 "/login"

Question

当我输入 /login 时，仪表板组件也会呈现。我需要在登录时省略仪表板组件。

Exact 属性不适合，因为 Dashboard 具有嵌套路径，如 /dashboard/users、/dashboard/settings

<BrowserRouter>
    <Route path='/'>
         <div>
             <Route path='/login'   component={Login}       exact   />
             <Route path='/'        component={Dashboard}           />
         </div>
    </Route>
</BrowserRouter>   

Answer 1

您可以使用 Switch 来呈现第一个匹配的 Route

<BrowserRouter>
    <Route path='/'>
         <div>
            <Switch>
              <Route path='/login'   component={Login}       exact   />
              <Route path='/'        component={Dashboard}           />
            </Switch>
         </div>
    </Route>
</BrowserRouter>