2017-04-02 124 views
1

我有两种布局:登录和注册组件的MainLayoutEmptyLayoutReact路由器V4结构

这是我目前的结构:

import { BrowserRouter as Router, Route } from 'react-router-dom'; 

const App =() => (
    <Router> 
    <Switch> 
     <Route exact path="/login"> 
     <EmptyLayout> 
      <LogInContainer /> 
     </EmptyLayout> 
     </Route> 
     <Route path="/"> 
     <MainLayout> 
      <Switch> 
      <Route exact path="/marketing" > 
       <MarketingComponent /> 
      </Route> 
      <Route exact path="/dashboard" > 
       <DashboardContainer /> 
      </Route> 
      <Route exact path="/admin/users" > 
       <UsersContainer /> 
      </Route> 
      <Route exact path="/admin/users/add" > 
       <AddUsersContainer /> 
      </Route> 
      </Switch> 
     </MainLayout> 
     </Route> 
    </Switch> 
    </Router> 
); 

这是一个好办法? 如何在这里包含404页面?

<EmptyLayout> 
    <NotFound /> 
</EmptyLayout> 

回答

0

<Switch/>组件呈现第一个匹配的<Route/><Route/>没有path总是匹配,所以你可以简单地把你的404里面的内容<Route>...</Route>为您<Switch/>的最后一个孩子。

这就是说,RRv4是非常强大的,因为你可以在你的应用程序的任意位置设置路线,所以喜欢在泰勒的回答,你可以让路由的/add部分在<UsersContainer/>处理。一旦relative routes土地,这将更容易。