登录时发生本机导航有效载荷错误

问题描述 投票:0回答:1

我在登录屏幕上遇到问题。一切正常,但是我的问题是成功登录后,我收到有效负载错误。我使用的是功能组件而不是类组件。而且我所有的屏幕都在Route.js之外。

错误是

我的Route.js代码如下:

 import  React, {  useState } from 'react';
import 'react-native-gesture-handler';
import {AsyncStorage} from 'react-native';
import { NavigationContainer } from '@react-navigation/native';
import { createStackNavigator } from '@react-navigation/stack';
/// All components of screens
import HomeScreen from './src/Component/HomeScreen';
import DefaultScreen from './src/Component/DefaultScreen';
import Privacy from './src/Component/Privacy';
import Signup from './src/Component/Signup';
import ForgetPassword from './src/Component/ForgetPassword';
import Dashboard from './src/Component/Dashboard';
import SplashScreen from './src/Component/SplashScreen';
const AuthContext = React.createContext();

export default function Routes(){
const Stack = createStackNavigator();
const [state, dispatch] = React.useReducer(
  (prevState, action) => {
    switch (action.type) {
      case 'RESTORE_TOKEN':
        return {
          ...prevState,
          userToken: action.token,
          isLoading: false,
        };
      case 'SIGN_IN':
        return {
          ...prevState,
          isSignout: false,
          userToken: action.token,
        };
      case 'SIGN_OUT':
        return {
          ...prevState,
          isSignout: true,
          userToken: undefined,
        };
    }
  },
  {
    isLoading: true,
    isSignout: false,
    userToken: null,
  }
);

React.useEffect(() => {
  // Fetch the token from storage then navigate to our appropriate place
  const bootstrapAsync = async () => {
    let userToken;

    try {
      userToken = await AsyncStorage.getItem('@kiklee-user-id');
    } catch (e) {
      // Restoring token failed
    }

    // After restoring token, we may need to validate it in production apps

    // This will switch to the App screen or Auth screen and this loading
    // screen will be unmounted and thrown away.
    dispatch({ type: 'RESTORE_TOKEN', token: userToken });
  };

  bootstrapAsync();
}, []);

const authContext = React.useMemo(
  () => ({
    signIn: async data => {
      // In a production app, we need to send some data (usually username, password) to server and get a token
      // We will also need to handle errors if sign in failed
      // After getting token, we need to persist the token using `AsyncStorage`
      // In the example, we'll use a dummy token

      dispatch({ type: 'SIGN_IN', token: 'dummy-auth-token' });
    },
    signOut: () => dispatch({ type: 'SIGN_OUT' }),
    signUp: async data => {
      // In a production app, we need to send user data to server and get a token
      // We will also need to handle errors if sign up failed
      // After getting token, we need to persist the token using `AsyncStorage`
      // In the example, we'll use a dummy token

      dispatch({ type: 'SIGN_IN', token: 'dummy-auth-token' });
    },
  }),
  []
);

if (state.isLoading) {
  // We haven't finished checking for the token yet
  return <SplashScreen />;
}
  //alert(authContext);


    return(
      <AuthContext.Provider value={authContext}>
      <NavigationContainer>
      <Stack.Navigator>
     {state.userToken == null ? (
  <>
    <Stack.Screen name="Home" component={HomeScreen} options={{ headerShown:false, animationTypeForReplace: state.isSignout ? 'pop' : 'push', }} />
    <Stack.Screen name="Privacy" component={Privacy} options={{ headerShown:false }} />
    <Stack.Screen name="ForgetPassword" component={ForgetPassword} options={{  headerShown:false }} />
    <Stack.Screen name="SignUp" component={Signup} options={{  headerShown:false }} />
    <Stack.Screen name="SplashScreen" component={SplashScreen} options={{ headerShown:false }} />
    </>
) : (
  <>
    <Stack.Screen name='Dashboard' component={Dashboard} />
    <Stack.Screen name="SplashScreen" component={SplashScreen} options={{ headerShown:false }} />

  </>
)}

      </Stack.Navigator>
    </NavigationContainer>
    </AuthContext.Provider>
            );



}

我的登录屏幕是HomeScreen.js'HomeScreen',登录后我将用户重定向到Dashboard.js'Dashboard'

reactjs react-native react-navigation react-navigation-stack
1个回答
0
投票

我认为代码await AsyncStorage.getItem('@kiklee-user-id')返回null,因此state.userToken值始终为null,并且您的<Stack.Navigator>组件没有任何Dashboard路由

© www.soinside.com 2019 - 2024. All rights reserved.