流星，流路由器和反應：如何讓FlowRouter.subsReady（）函數在呈現中被反應

Question

我想創建一個模式，以便在加載主頁之前準備好所有的訂閱。類似於鐵路路由器waitOn。

看看這個反應成分：

export const PageContainer = React.createClass({ 
    render() { 
    return (
     <div id="content-box"> 
     <div className="banner banner-primary"> 
      <div className="page_title pull-left"> 
      {this.props.pageName} 
      </div> 
     </div> 
     <div> 
      { FlowRouter.subsReady() ? this.props.page : (
       <div> Loading .... </div> 
      ) 
      } 
     </div> 
     </div> 
    ); 
    } 
}); 

，你可以看到我使用的是FlowRouter.subsReady()幫手來渲染頁面或加載文本。

問題是這不是被動的。它只呈現一次，但不會更新並在訂閱準備就緒後顯示該頁面。

我怎樣才能得到這個反應？

使用Flow Router的訂閱管理與React的最佳方式是什麼？我有一個基礎佈局，並希望在加載頁面主之前顯示加載符號。如果我能讓這個功能被反應，它應該工作得很好。

UPDATE：

好像我有助手，FlowRouter.subsReady（）連接到獲取流星數據功能

export const PageContainer = React.createClass({ 
    mixins: [ ReactMeteorData ], 
    getMeteorData() { 
    return { 
     isLoading: FlowRouter.subsReady() 
    } 
    }, 
    render() { 
    return (
     <div id="content-box"> 
     <div className="banner banner-primary"> 
      <div className="page_title pull-left"> 
      {this.props.pageName} 
      </div> 
      <i className="fa fa-question-circle help-icon pull-right"></i> 
     </div> 
     <div> 
      { this.data.isLoading ? this.props.page : (
       <div> Loading ... </div> 
      ) 
      } 
     </div> 
     </div> 
    ); 
    } 
}); 

這似乎是現在的工作。這是做到這一點的方式嗎？

Answer 1

您以錯誤的方向訪問了問題。當使用流星進行反應時，您並不需要檢查subsReady的FlowRouter。只需安裝mixin ReactMeteorData並正確設置this.data，它會反應性渲染Dom。更多詳情here

反應render沒有反應。 Dom僅在組件的props或state更改時纔會重新渲染