Ich habe eine React-App mit einer übergeordneten Komponente und drei untergeordneten Komponenten. In der übergeordneten Komponente habe ich einen Status, der Daten enthält, und übergebe diese Daten in Requisiten an untergeordnete Komponenten. Ich habe auch drei Endpunkte und muss drei Ajax-Anforderungen an die componentDidMount-Funktion der übergeordneten Komponente senden. Wie mache ich das in React?

var Parent = React.createClass({
    getInitialState: function(){
        return ( {
            data1: [],
            data2: [],
            data3: []
        });
    },
    componentDidMount: function() {
        ???
        ???
        ???
    },
    render: function(){
        return (
            <div>
                <Child1 data={this.state.data1} />
                <Child2 data={this.state.data2} />
                <Child3 data={this.state.data3} />
            </div>
        )
    }
})

var Child1 = React.createClass({
    render: function() {
        return (
            <div>
                {this.props.data}   
            </div>
        )
    }
})

var Child2 = React.createClass({
    render: function() {
        return (
            <div>
                {this.props.data}   
            </div>
        )
    }
})

var Child3 = React.createClass({
    render: function() {
        return (
            <div>
                {this.props.data}   
            </div>
        )
    }
})

Ich möchte die übergeordnete Komponente mit dem Overlay "Loading ..." rendern und auf componentDidMount 3 Anforderungen senden, den Status aktualisieren und Daten als Requisiten an untergeordnete Komponenten übergeben, wenn alle 3 Anforderungen erfolgreich abgeschlossen wurden, und diese untergeordneten Komponenten dann rendern / erneut rendern . Wenn es ein Problem mit einer Anfrage gibt, möchte ich keine untergeordnete Komponente rendern (das Laden ... wird bis zum Erfolg fortgesetzt). Async oder eine Anfrage erfolgreich?

Danke im Voraus