2016-08-25 10 views
0

なぜcomponentDidMount内のthis.state.boardにアクセスできないのですか?私が理解しているように、コンポーネントがレンダリングされると、componentDidMountは直後に1回だけ起動されます。componentDidMount内の状態データにアクセス

私はGoogleアナリティクスの電子商取引トラッカーを設定しようとしています。そのため、最適な場所は、GAトラッカーが一度だけ呼び出されることを保証するため、componentDidMount内にあると考えました。ただし、GAに返信するための状態データにはアクセスできません。何か案は?

//function which establishes state 
    function getEditorState() { 
     var board = Editor.getCsb(); 
     var similarBoard = Editor.getSimilarLsbs(); 
     return { 
      board: board, 
      similarBoard: similarBoard, 
      editing: Editor.isEditing(), 
      hoverColor: Editor.getHoverColor(), 
      variant: Editor.variant(), 
      lidAndLsb: Editor.getLidAndLsb() 
     }; 
    } 



    //component  
    var CsbEditorApp = React.createClass({ 

      getInitialState: function() { 
       return getEditorState(); 
      }, 

      componentDidMount: function() { 
       console.log(this.state.board); // <---- this returns an empty object. 
       Editor.addChangeListener(this._onChange); 
       SbAction.loadCsb(this.props.params.cid); 
      }, 

      render: function() { 
      console.log(this.state.board); // <---- this returns the the board object with data. 
      return (
      <div className={cm('lightbox sb-bg overlay-border')} ref="app"> 
       <Header board={this.state.board} label={this.state.label} socialLinkStatus={this.state.socialLinkStatus} buyingAll={this.state.buyingAll} /> 
       <div className="viewer-content"> 
        <div id="csb-content"> 
         <MetaText className="meta-author" metaKey="author" board={this.state.board} /> 
         <BoardMeta board={this.state.board}/> 
         <CsbPanel board={this.state.board hoverColor={this.state.hoverColor} showPanel={showPanel} /> 

         <RouteHandler/> 
        </div> 
       </div> 
      </div> 
     ); 
    }, 
_onChange: function() { 
     this.setState(getEditorState()); 
     $("#cc_hover").hide(); 
    } 
}); 
+0

コードを入力できますか? – LuisPinto

+0

@ LuisPinto私は自分のコードを –

+0

追加しましたgetEditorState()をコンポーネントの中に入れてみることができますか? – LuisPinto

答えて

0

console.logデバッグの信頼できる方法ではありません - この方法は非同期で、実際にあなたがあなたのリスナーを設定したか、それは(状態に影響を与える)を登録コールバックがトリガされた後であっても後に呼び出さ得ることができ、デバッガを使用してください。また、Editor.addChangeListener(this._onChange);行をコメントアウトして問題が発生するかどうか確認してください。

関連する問題