Tengo esta función en mi archivo .tsx :
doIsChecked() { var isItChecked = document.getElementById('isPless') as HTMLInputElement; console.log('updateDocsFlag before: ' + this.state.updateDocsFlag); if (isItChecked.checked) { this.setState({ updateDocsFlag: true }); } else { this.setState({ updateDocsFlag: false }); } console.log('updateDocsFlag after: ' + this.state.updateDocsFlag); } Se llama cuando una casilla de verificación está marcada/desmarcada. Noté que si isItChecked es verdadero updateDocsFlag es falso, como se puede ver en las entradas de registro anteriores y posteriores. Este no es el comportamiento que esperaba ¿Hay algún problema con mi código?
this.setState es asíncrono. establece el estado correcto, pero no en el momento de la llamada. así que cuando llames
console.log('updateDocsFlag after: ' + this.state.updateDocsFlag);todavía ves el viejo estado. intenta hacer lo siguiente:
doIsChecked() { var isItChecked = document.getElementById('isPless') as HTMLInputElement; console.log('updateDocsFlag before: ' + this.state.updateDocsFlag); let updateDocsFlag = isItChecked.checked; this.setState({ updateDocsFlag }); console.log('updateDocsFlag after: ' + updateDocsFlag); }de esta manera, no registra el estado, sino el valor que pasa al estado. Se supone que hay que ver allí el valor correcto. (y el estado real se actualizará con este valor después de que finalicen todos los seguimientos de funciones activas)