当我重新加载 react-native 应用程序时,异步存储不起作用

问题描述

我在登录后会转到主屏幕和个人资料屏幕,但是如果我重新加载或关闭应用程序然后再次打开它而不是在主屏幕上打开它,它会再次转到登录.我尝试使用 AsyncStorage 来保存用户,直到我注销然后将其删除,但仍然无法正常工作。有什么帮助吗?

APP.JS

const getToken = async () => {
    let value = await AsyncStorage.getItem('token');
    if (value !== null) {
      setToken(value);
    }
  };

  useEffect(() => {
    getToken();
  },[]);

  return (
    <NavigationContainer>
      <stateContext.Provider value={{token,setToken}}>
         <Stack.Navigator screenoptions={{headerShown: false}}>
         {!token ? (
            <>
            <Stack.Screen name="Login" component={LoginPage} />
            <Stack.Screen name="Verification" component={VerificationPage} />
            </>
         ) : (
            <>
            <Stack.Screen name="Home" component={Home}/>
            <Stack.Screen name="Profile" component={Profile} />
            </> )}
         </Stack.Navigator>
       </stateContext.Provider>
      </NavigationContainer>  
     )

LOGIN.JS

  const phoneNumberLogin = async (phoneNumber) => {
    try {
      let res = await axios({
        url: `XXXX`,method: 'post',headers: {
          'Content-Type': 'application/json',},});
      if (res.status == 200) {
        setToken(res.data.firstName);
        AsyncStorage.setItem('token',token);
      }
      return res.data;
    } catch (err) {
      console.error(err);
    }
  };

解决方法

尝试在 useEffect 中移动 getToken 函数。我在使用异步函数和 useEffect 时遇到了问题,这个解决方案对我有用。

useEffect(() => {
   const getToken = async () => {
      let value = await AsyncStorage.getItem('token');
      if (value !== null) {
         setToken(value);
      }
   };
getToken();
},[]);