时间戳

首页 > 解决方案 > 当我重新加载 react-native 应用程序时，异步存储不起作用

reactjs - 当我重新加载 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>  
     )

登录.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);
    }
  };

标签： reactjsreact-nativelocal-storageasyncstorageuse-context

解决方案

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

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

推荐阅读