루트 라우터에서 콘텐츠를 표시하는 리 라우터 라우터

Question

SPA에 리얼 라우터를 사용하고 있지만 인덱스 경로 "/"에 일부 콘텐츠를 표시하는 방법을 모르겠습니다.

<Route path="/" component={App}> 
    // ... 
</Route> 

최상위 요소는 머리글/바닥 글 및 기타 공통 요소 렌더링 :

내 최고 수준의 라우터의 구성은 그냥

<nav> 
    // ... 
</nav> 

{children} 

<nav className="footer"> 
    // ... 
</nav> 

아동 경로가 제대로 작동됩니다, 그들은 내 렌더링 App 구성 요소. 그러나 루트 루트의 일부 컨텐츠를 어떻게 렌더링하여 빈 페이지가 아닌가?

Answer 1

<App>에 루트 경로로 사용하고자하는 콘텐츠가 <Home> 인 경우, 아래는 guide에서 react-route으로 표시됩니다.

<Router> 
    <Route path="/" component={App}> 
    <IndexRoute component={Home}/> 
    <Route path="accounts" component={Accounts}/> 
    <Route path="statements" component={Statements}/> 
    </Route> 
</Router> 

그리고 이것은 <App>입니다.

const App = React.createClass({ 
    render() { 
     return {this.props.children || <Home/>}; 
    } 
});