javascript - react - state setstate
Reaccionar setState no actualiza el estado (4)
Entonces tengo esto:
let total = newDealersDeckTotal.reduce(function(a, b) {
return a + b;
},
0);
console.log(total, ''tittal''); //outputs correct total
setTimeout(() => {
this.setState({dealersOverallTotal: total});
}, 10);
console.log(this.state.dealersOverallTotal, ''dealersOverallTotal1''); //outputs incorrect total
newDealersDeckTotal es solo una serie de números
[1, 5, 9]
p
[1, 5, 9]
ej., sin embargo,
this.state.dealersOverallTotal
no proporciona el total correcto, pero el
total
sí.
Incluso puse un tiempo de espera para ver si esto resolvió el problema.
cualquier obvio o debo publicar más código?
Usando async / await
async changeHandler(event) {
await this.setState({ yourName: event.target.value });
console.log(this.state.yourName);
}
setState es asíncrono. Puede usar el método de devolución de llamada para obtener el estado actualizado.
changeHandler(event) {
this.setState({ yourName: event.target.value }, () =>
console.log(this.state.yourName));
}
setState()
suele ser asíncrono, lo que significa que en el momento en que
console.log
el estado, aún no está actualizado.
Intente poner el registro en la devolución de llamada del método
setState()
.
Se ejecuta después de completar el cambio de estado:
this.setState({ dealersOverallTotal: total }, () => {
console.log(this.state.dealersOverallTotal, ''dealersOverallTotal1'');
});
setState()
toma tiempo para mutar el valor y tu javascript es
asynchronous
y por lo tanto tu
console.log()
se ejecutará antes de que
setState
los valores y por lo tanto veas el resultado.
Para resolverlo, registre el valor en la
callback function of setState
como
setTimeout(() => {this.setState({dealersOverallTotal: total}, function(){
console.log(this.state.dealersOverallTotal, ''dealersOverallTotal1'');
});
}, 10)