react-router |如何爲路由器的渲染，如果組件狀態改變

我有簡單的main.js文件：react-router |如何爲路由器的渲染，如果組件狀態改變

import React from 'react'; 
import ReactDOM from 'react-dom'; 

import App from "./components/app"; 

ReactDOM.render(<App />, 
    document.getElementById('appContainer') 
);

應用程序組件定義路線：

render(){ 
    console.log('app', this.state.current, this.state.global); 
    return (
     <Router> 
      <Route path="/" component={Template} current={this.state.current}> 
       <IndexRoute component={GlobalList} global={this.state.global} /> 
       <Route path="current" component={CurrentList} current={this.state.current} /> 
       <Route path="item/:item" component={ItemDetail} /> 
      </Route> 
     </Router> 
    ); 
}

我用的是re-base包我的火力地堡溝通數據庫。對於所有應用程序，該庫不允許對一個端點執行syncState多次。這是一個原因，爲什麼我在App組件中獲取這些數據並想將它們傳遞給路由。這是一個問題。

這console.log在渲染方法被稱爲4倍。前兩個給出空數據，第三個給出第一個端點和第四個第二個端點。但路線不會更新。我可以在Template元素中看到，該render方法也被調用4次，但每次props.route.current都是一個空數組，即使在App this.state.current是長度大於0的數組。

我將不勝感激任何提示如何解決此問題問題。如果還有其他方法可以做到的話，我很樂意閱讀任何好的做法提示。我使用最新版本的庫，ES6和webpack/babel來構建。

來源

2016-01-03 Kania

重新基地不（目前）允許您呼叫syncState在單組分不止一個端點。您可以在應用程序中多次調用syncState。 –

@TylerMcGinnis我應該怎樣理解這一點：「未捕獲錯誤：REBASE：端點（currentList）已經有聽衆syncState」 – Kania

所以這只是對內存泄漏保護，這樣你就不會在同一個火力點端點設置多個聽衆。你需要做的是當組件卸載來移除監聽器時調用removeBinding。然後，您可以在需要時重新設置。 –

有時閱讀所有庫文檔是很好的。

感謝@TylerMcGinnis他的耐心和不使用硬話:)

此問題的解決方案是使用bindToState方法，如果你想只綁定更改狀態，但不能更改發佈到火力地堡。這是我的情況 - 只有一個組件需要同步更改，第二個只需要聽第一個組件的更改。

來源

2016-01-04 19:59:19 Kania

很高興你知道了！硬性詞彙是初學者的敵人。我很高興我練習傳道！ –

react-router |如何爲路由器的渲染，如果組件狀態改變

回答

相關問題