使用react-router的多个主视图

Question

在使用react-router时，我无法获得多个“主”视图来处理路由。下面是我的路由配置：

const routes = (
  <Route path="/" component={AppView}>
    <Route path="/log-in" component={LogInView}/>
    <IndexRoute component={MainView}>
      <IndexRoute component={HomeView} />
      <Route path="company" component={CompanyView} />
      <Route path="clients" component={ClientsView} />
      <Route path="terms-of-service" component={TermsOfServiceView} />
      <Route path="privacy-policy" component={PrivacyPolicyView} />
      <Route path="contact" component={ContactView} />
    </IndexRoute>
  </Route>
);

你有什么想法吗?我该怎么做呢？

Answer 1

多亏了knowbody，解决方案非常简单，只需从顶级路由元素中删除path属性，并将MainView的IndexRoute更改为普通路由：

const routes = (
  <Route component={AppView}>
    <Route path="/log-in" component={LogInView} />
    <Route path="/" component={MainView}>
      <IndexRoute component={HomeView} />
      <Route path="company" component={CompanyView} />
      <Route path="clients" component={ClientsView} />
      <Route path="terms-of-service" component={TermsOfServiceView} />
      <Route path="privacy-policy" component={PrivacyPolicyView} />
      <Route path="contact" component={ContactView} />
    </Route>
  </Route>
);