2017-12-26 7 views
0

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.

Antwort

2

Ihre Komponente empfängt die loading-Prop von einer übergeordneten Komponente/Geschäft und componentWillRecieveProps wird ausgelöst, kurz bevor diese Stütze auf Ihre Komponente angewendet wird. Also von dem, was ich sammle:

  1. loading ist true im Laden gesetzt, und die Laden Sie Ihre Komponente zu sagen, dass beginnt Laden - es noch false in Ihrer Komponente

  2. es true in beiden Set

  3. loading auf false in den Laden gesetzt, das Geschäft sagt Ihre Komponente, die vollständig geladen ist

  4. es auf false in beide

1 und 3 sind das Brennen des loading prop aus dem Speicher zu dem Bauteil und 2 und 4 sind Brennen aufgrund andere Requisiten Aktualisierungen sein passieren. (nicht im Zusammenhang mit dem Laden)

Verwandte Themen