Actualmente estoy jugando con formas de cambiar el estado dentro de un evento onPress en React-Native y no he tenido mucha suerte. Cuando alguien presiona el botón "¿Cambiar estado?" opción en la alerta convocada, me gustaría cambiar el estado a true . Sin embargo, al llamar a setState() o useCallback() que alterna el estado, continúa imprimiendo falso impreso (dos veces).
FYI: Llamo a la alerta como ExampleAlert() en lugar de <ExampleAlert /> en otra parte de mi código.
¿Este problema tiene algo que ver con la forma en que se escriben las alertas en RN o con el hecho de que las alertas no activan una nueva representación?
const [state, setState] = useState(false); const changeStateCallback = useCallback(() => { setState(!state); }, [state]); const ExampleAlert = () => { Alert.alert( 'Title', 'Message', [ { text: 'Change State?', onPress: () => { changeStateCallback; console.log(state); setState(true); console.log(state); }, }, { text: 'OK', onPress: () => {}, }, ], ); return null; };useState es asíncrono, no puede ver el cambio en el mismo entorno
entonces solo necesitas hacer esto:
onPress: () => { setState(true); },o
const handlePress =()=>{ setState(true); } onPress: () => { handlePress }, esta sintaxis () => { } aún no se ejecuta, se ejecuta cuando el usuario hace clic sobre eso.
editar 1:
const handlePress =()=>{ setState(true); console.log(state) // here you can not see the change } console.log(state) //put your console outside of handlePress to see the changeCreo que conozco tu problema.
console.log() es una función síncrona, setState() es asíncrona, el llamado código asíncrono no se ejecutará hasta que todo lo que está en la pila de llamadas actual termine de ejecutarse.
No verá cambios de estado hasta más adelante.
¿Has intentado visualizar el estado con herramientas de depuración?
Pregunta similar: Console.log() después de setState() no devuelve el estado actualizado