ReactJSで同時に複数のajaxを呼び出す方法（結果を非同期にする方法）

Question

ReactJSで複数のajax呼び出しを送信したいのですが、コードが順番に実行されているのだろうかと思います。最初のReactJSコンポーネントがレンダリングされた後でなければ、2番目のajax呼び出しは送信されませんか？

var firstAJAX = React.createClass({ 
    componentWillMount: function() { 
    this.state = {list: []}; 
    }, 
    componentDidMount: function() { 
    $.ajax({ 
     url: '/someurl', 
     dataType: 'json', 
     cache: false, 
     type: 'GET', 
     success: function(data) { 
     this.setState({list: data}); 
     }.bind(this), 
     error: function(xhr, status, err) { 
     console.error('url', status, err.toString()); 
     }.bind(this) 
    }) 
    }, 
    render: function() { 
    return (
     <div> 
      {something} 
     </div> 
    ) 
    } 
}) 
ReactDOM.render(<firstAJAX />, 
    document.getElementById('div') 
); 

var secondAJAX = React.createClass({ 
    //similar code with different url from firstAJAX 
}); 

私は、結果がajaxから得られた複数のドキュメント要素を処理したいと考えています。 を送信するためにどのように1 ajax->レンダー>送って1 ajax->レンダリング - > ...はが複数のajaxsをお送りになる - >レンダリング - >レンダリング...

Answer 1

をしたいと子要素の動作を定義することができ、第二AJAX呼び出しは、レンダリングされた最初の1の後に起こるでしょう。

ReactDOM.render(<secondAJAX />, 
    document.getElementById('div') 
); 

私はあなたがこの質問で達成しようとしていることはわかりませんが、おそらくこのようにしたくないでしょう。

Answer 2

を私はあなたの方法でのだと思いますcontainer componentsパターンを使用してください。この場合、あなたは、コンテナ内firstAJAX & secondAJAXのための2つの要求を実行し、あなたがあなたのvar secondAJAX = ...宣言の後、次のコードを追加しますと仮定