Ein Zustand, der nach setState

Question

zurückbleibt In meiner React-Komponente habe ich eine Funktion, die this.setState aufruft, und aktualisiert einige Zustände. Einer von ihnen ist jedoch immer ein Zustand "hinter", und ich vermute, dass es daran liegt, wie es heißt. Hier

ist die Funktion, in der die Zustände eingestellt sind:

handleReps(reps) { 
    var average = this.getAverage(); 
    this.setState({ 
     var1: CALCULATORS.epley(reps, this.state.weight), 
     var2: CALCULATORS.brzycki(reps, this.state.weight), 
     var3: CALCULATORS.lander(reps, this.state.weight), 
     // some more 
     average: average 
    }); 
} 

nun alle diese Aktualisierung in Ordnung, und sind in der DOM geändert, aber der average Zustand ist immer ein Zyklus hinter sich. Das heißt, es zeigt immer den Wert an, den es VOR der letzten Änderung hätte haben sollen. I.e. das letzte Mal setState wurde aufgerufen.

Gibt es bekannte Faktoren, die diese Verzögerung in einem der Zustände verursachen können?

EDIT: Hier ist die getAverage() Funktion.

getAverage() { 
    return CALCULATORS.average([ 
     this.state.epley, this.state.brzycki, this.state.lander, 
     this.state.lombardi, this.state.mayhew, this.state.oconner, 
     this.state.wathen 
    ]) 
} 

Answer 1

Das Problem hier war zweifach.

Wie Igorsvee genau darauf hingewiesen, berechnete ich den Durchschnitt mit alten Staaten. Anfängerfehler meinerseits.

Das Problem jedoch beharrte, nachdem ich anfing, "neue" Zustände zu verwenden. An diesem Punkt erfuhr ich, dass die Zustände nicht sofort mutieren, also selbst wenn ich die richtige Reihenfolge hatte, verwendete es immer noch Ein-Zyklus-alte Zustände.

Dies wurde gelöst, indem ein Callback als zweites Argument an die setState-Funktion übergeben wurde. Dieser Rückruf wird als AFTER-Mutation bezeichnet und verwendet brandneue Werte.

Answer 2

Sie verwenden, um die aktuellen Werte aus dem Zustand den Mittelwert zu berechnen, aber zur gleichen Zeit, die Sie den Zustand mit dem neuen values.So aktualisieren, im Grunde, speichern Sie die veralteten Daten für die average.I'd vorschlagen Speichern Sie die berechneten Daten nicht, sondern rufen Sie die Berechnungsmethode auf, sobald Sie sie benötigen.