在 react-router 中隐藏父组件答案

【问题标题】：Hide parent component in react-router在 react-router 中隐藏父组件
【发布时间】：2016-03-10 22:08:21
【问题描述】：

在反应路由器中有没有办法有子路由但不显示父组件？我试图在我的应用程序中显示面包屑，所以我切换到有子路由，但我不想以“主/详细”类型布局的方式显示父组件。我只希望子组件显示为好像它是自己导航到的，但似乎如果您没有在父组件中的某处包含{this.props.children}，那么子组件将永远不会被渲染。

我尝试过的一个技巧是查看this.props.children 是否已填充，并且不会像渲染一样显示页面的其余部分

if(this.props.children) {
   return (this.props.children) 
} else { 
  return /**rest of render method**/
}

但这感觉像是一个糟糕的解决方案。

【问题讨论】：

标签： reactjs react-router

【解决方案1】：

我无法准确理解您要做什么，但似乎<IndexRoute> 可以帮助您，因为这可以让您区分您在/portal 和/portal/feature 所做的事情

<Route path="/portal" component={ComponentContainingBreadcrumbs}>
  <IndexRoute component={ComponentWithRestofRenderMethodFromYourExample} />
  <Route path="child1" component={Child1} />
  <Route path="child2" component={Child2} />
</Route>

【讨论】：