2016-02-29 19 views
0

我試圖實現反應路由器到反應SPA來添加一些URL,但主要的應用程序只顯示在每個設置的路由。react-router總是顯示主頁

繼承人的主要的應用程序代碼

render: function() { 
     return (

      <div className="row panel panel-default"> 

       <h2 className="text-center">Projects</h2> 

       <ul> 
        <li><Link to="/1">About</Link></li> 
        <li><Link to="/2">Inbox</Link></li> 
       </ul> 

       { 

        <div className="col-md-8 col-md-offset-2"> 

         <Header itemsStore={this.firebaseRefs.items}/> 
         <hr /> 
         <div className={"content " + (this.state.loaded ? 'loaded' : '')}> 
          <List items={this.state.items}/> 
          {this.deleteButton()} 
         </div> 
        </div> 

       } 

       {this.props.children} 

      </div> 
     ) 

    }, 

回答

1

<App>組件需要渲染this.props.children

var App = React.createClass({ 
    render: function() { 
     return (
      <div> 
       <div id="nav_bar">links links links layout whatever</div> 
       <div id="content"> 
        {/* Route component gets rendered here */} 
        {this.props.children} 
       </div> 
      </div> 
     ); 
    } 
}); 

陣營路由器的例子:https://github.com/reactjs/react-router/tree/master/examples

+1

究竟是如何做呢?我是React的新成員。 – ChrisM

+0

更新了錯誤 –

+0

謝謝。你是否必須瀏覽導航鏈接,或者如果它直接輸入地址欄,它應該工作嗎? – ChrisM