Hola, he estado aprendiendo ReactJs y escribí estas líneas:
handlerClick(i) { this.setState( (state) => (state.squares = [...state.squares, (state.squares[i] = "X")]) ); }Ahora, sé lo que está sucediendo, pero estoy confundido con la forma en que funciona, el orden en que se ejecuta cada operación...
Con respecto al orden de las operaciones, todo lo que se encuentra a la derecha de un operador de asignación se evalúa antes de que tenga lugar la asignación, por lo que cada uso de state en la expresión a la derecha de = se refiere al state antes de que ocurra cualquier asignación.
Con respecto al uso adecuado de setState, no debe asignar a su estado anterior, sino devolver un objeto completamente nuevo:
handlerClick(i) { this.setState((state) => { const squares = [...state.squares]; squares[i] = "X"; return {...state, squares }; }); }O equivalente:
handlerClick(i) { const squares = [...this.state.squares]; squares[i] = "X"; this.setState({...this.state, squares}); }