/ / ReactJSで同時に複数のajaxを呼び出す方法(結果を非同期にする方法) - javascript、jquery、ajax、reactjs

ReactJSで同時に複数のajaxを呼び出す方法(結果を非同期にする方法) - javascript、jquery、ajax、reactjs

私は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-> render-> 1 ajax-> render - >を送信します。 〜になる 複数のajaxを送る - > render - > render ...

回答:

回答№1は0

あなたの後に次のコードを追加すると仮定します var secondAJAX = ... 2番目のajax呼び出しは、最初のレンダリングが行われた後に発生します。

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

私はあなたがこの質問で達成しようとしていることを知っていませんが、おそらくあなたはこのようなことをやりたくはありません。


回答№2の場合は0

私はあなたの方法は使用することだと思います コンテナコンポーネント パターン。この場合、次の2つの要求を実行できます。 firstAJAX そして、 secondAJAX コンテナ内に配置し、必要に応じて子要素の動作を定義します