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