In meiner React App mit react-apollo
und react-router-redux
Setup, jedes Mal, wenn ich eine neue Route abfahre, löst der neue Abfrageparameter eine neue GraphQL-Abfrage aus . Und ich brauchte oft Rückrufe, nachdem die Abfrage durchgeführt wurde.Grund hinter (! NextProps.data.loading && this.props.data.loading)
Ich kann das in componentDidMount
nicht tun, da die Komponente nie beendet wird, wird es nur erneut gerendert.
So fand ich diese Lösung here, die verwendet:
componentWillRecieveProps(nextProps){
if (!nextProps.data.loading && this.props.data.loading) {
doMyCallBack();
}
}
Es funktioniert perfekt, aber ich verstehe nicht wirklich, warum. Als das, was ich bemerkt haben, wird componentWillReceiveProps
3-mal ausgelöst eine neue Route auf den Versand:
1) Auf einen Link klicken:
nextProps.data.loading: true
this.props.data.loading: false
2) Unter welchen Situation beide Variablen wahr?
nextProps.data.loading: true
this.props.data.loading: true
3) Hier machen wir unsere Rückrufe. Aber die Daten werden noch geladen ??
nextProps.data.loading: false
this.props.data.loading: true
Das letzte passiert, wenn die Komponente neue Requisiten aus anderen Aktionen erhalten und löst keine apollo-Abfragen, die total Sinn macht:
nextProps.data.loading: false
this.props.data.loading: false
ich nicht herausfinden kann, was los ist während Schritt 1, 2 und 3.