React native 每次本地Expo应用刷新时都要注销?

React native 每次本地Expo应用刷新时都要注销?,react-native,expo,asyncstorage,React Native,Expo,Asyncstorage,我是一个新的反应本机和使用世博会,并试图登录使用AuthContext和AsyncStorage,登录后,它带我到主屏幕。但当我更改组件时,它会刷新应用程序并将我从应用程序中注销。每次我做一些更改,我都需要再次登录 谁能帮我找出哪里出了问题。我现在使用AsyncStorage进行离线支持和还原 App.js <AuthContext.Provider value={authContext}> <NavigationContainer> { lo

我是一个新的反应本机和使用世博会,并试图登录使用AuthContext和AsyncStorage,登录后,它带我到主屏幕。但当我更改组件时,它会刷新应用程序并将我从应用程序中注销。每次我做一些更改,我都需要再次登录

谁能帮我找出哪里出了问题。我现在使用AsyncStorage进行离线支持和还原

App.js

<AuthContext.Provider value={authContext}>
      <NavigationContainer>
        { loginState.userToken != null ? (
          <Drawer.Navigator>
            <Drawer.Screen name="Home" component={PreNav}/>
            <Drawer.Screen name="Support" component={SupportScreen}/>
            <Drawer.Screen name="Settings" component={SettingsScreen}></Drawer.Screen>
          </Drawer.Navigator>
        ): <RootStackScreen />
        }
      </NavigationContainer>
    </AuthContext.Provider>

const initialLoginState = {
    isLoading: true,
    userName: null,
    userToken: null,
  }

  const loginReducer = (prevState, action) => {
    switch(action.type) {
      case 'RETRIEVE_TOKEN':
        return {
          ...prevState,
          userToken: action.token,
          isLoading: false
        };
      case 'LOGIN':
        return {
          ...prevState,
          userName: action.id,
          userToken: action.token,
          isLoading: false
        };
      case 'LOGOUT':
        return {
          ...prevState,
          userName: null,
          userToken: null,
          isLoading: false
        };
      case 'REGISTER':
        return {
          ...prevState,
          userName: action.id,
          userToken: action.token,
          isLoading: false
        }; 
    }
  }

  const [loginState, dispatch] = useReducer(loginReducer, initialLoginState)

  const authContext = useMemo(() => ({
    userLogin: async (userName, password) => {
      // setUserToken("abc");
      // setLoading(false);
      let userToken;
      userToken = 'abc';
      if (userName == 'user' && password == 'pass') {
        try {
          await AsyncStorage.setItem('userToken', userToken)
        }
        catch(e) {
          console.log(e);
        }
      }
      dispatch({type: 'LOGIN', id: userName, token: userToken});

    },

    userSignup: () => {
      
    },
  }));

  useEffect(() => {
    setTimeout(async () => {
      // setLoading(false);
      let userToken;
      try {
        await AsyncStorage.getItem('userToken')
      }
      catch(e) {
        console.log(e);
      }
      dispatch({type: 'RETRIEVE_TOKEN', token: userToken});
    }, 1000);
  }, []);


根据您提供的代码观察

这是一个问题,原因是使用RETRIVE_TOKEN操作保存userToken时工作不正常,因为代码行为没有将userToken的变量初始化为从异步存储获取的值,因此,必须使用从异步存储获取的值初始化userToken变量

您可以在App.js useffect钩子中尝试以下代码更改

  useEffect(() => {
    setTimeout(async () => {
      let userToken;
      try {
        userToken = await AsyncStorage.getItem('userToken')
      }
      catch(e) {
        console.log(e);
      }
      dispatch({type: 'RETRIEVE_TOKEN', token: userToken});
    }, 1000);
  }, []);

哇!我犯了这么愚蠢的错误。谢谢
export const AuthContext = createContext();
  useEffect(() => {
    setTimeout(async () => {
      let userToken;
      try {
        userToken = await AsyncStorage.getItem('userToken')
      }
      catch(e) {
        console.log(e);
      }
      dispatch({type: 'RETRIEVE_TOKEN', token: userToken});
    }, 1000);
  }, []);