Simplemente quiero que mi código de método de renderizado se ejecute después del estado de actualización en useEffect .

Guardo mi token en asyncStorage y ahora quiero que, si existe el token, se redirija a la página de homePage de lo contrario, regrese a la página de inicio de loginPage . Pero el problema es que el método de renderizado se ejecuta antes de actualizar mi estado en useEffect . Y me mantiene en la página de inicio de loginPage incluso si tenía token.

Mi código está a continuación:

 import React, { useEffect, useState } from 'react'; import { createStackNavigator } from '@react-navigation/stack'; import { NavigationContainer } from '@react-navigation/native'; import { StyleSheet, Text, View} from 'react-native'; import AsyncStorage from '@react-native-async-storage/async-storage'; import { useLinkProps, useNavigation, CommonActions } from '@react-navigation/native'; import MainScreen from './src/screens/MainScreen'; import SignIn from './src/screens/SignIn'; const Stack = createStackNavigator(); const App = props => { const [isSigned, setIsSigned] = useState(false); useEffect(async () => { let token = await AsyncStorage.getItem("@token"); console.log("token", token); if (token) { setIsSigned(true); props.navigation.navigate('MainScreen'); } else { setIsSigned(false); props.navigation.navigate('SignIn'); } }, []) return ( <NavigationContainer> <Stack.Navigator initialRouteName={isSigned ? "MainScreen" : "SignIn"} screenOptions={{ headerShown: false }} > <Stack.Screen name="Login" component={SignIn} /> <Stack.Screen name="MainScreen" component={MainScreen} /> </Stack.Navigator> </NavigationContainer> ); }; const styles = StyleSheet.create({ container: { marginTop: Platform.OS === 'android' ? '3%' : '10%' } }); export default App;