Question

我有三个导航员。它们中的两个在第三个主导航器中合并。

第一个导航器：

// Stack Navigator
const AppStackNavigator = createStackNavigator(
  {
    Login: Login,
    HomeScreen: HomeScreen,
    SignUp: SignUp,
    ForgotPassword: ForgotPassword,
  },
  {
    initialRouteName: 'Login',
  }
);

第二个导航器：

// Tab Navigator
const BottomNavigator =  createBottomTabNavigator(
  {
    Home: HomeScreen,
    MyJobs: MyJobs,
    MyProfile: MyProfile,
    Settings: Settings,
  },
  {
    // configuration
  }
);

组合导航器：

// Combining Navigators
const RootStack = createStackNavigator(
  {
    AppStackNavigator: AppStackNavigator,
    BottomNavigator: BottomNavigator
  }
)

但是，我无法做到这一点。我继续在我的Android模拟器上收到此错误：

The component for route 'AppStackNavigator' must be a React component. For example:

import MyScreen from './MyScreen';
...
AppStackNavigator: MyScreen,
}

You can also use a navigator:

import MyNavigator from './MyNavigator';
...
AppStackNavigator: MyNavigator,
}

我正在尝试使用组合导航器。我在做什么错了？

Answer 1

您的代码很奇怪，尤其是路由配置...您看过react-navigation documentation吗？

尝试将YourScreenName更改为{screen: YourScreenName }。您的每条导航路线。

例如：

// Stack Navigator
const AppStackNavigator = createStackNavigator(
  {
    Login: {screen: Login},
    HomeScreen: {screen: HomeScreen},
    SignUp: {screen: SignUp},
    ForgotPassword: {screen: ForgotPassword},
  },
  {
    initialRouteName: 'Login',
  }
);

在React Navigation中组合两个导航器

1 个答案: