时间戳

首页 > 解决方案 > 在 React Navigation 中组合两个导航器

android - 在 React Navigation 中组合两个导航器

问题描述

我有三个导航器。其中两个组合在第三个主导航器中。

第一导航员：

// 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,
}

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

标签： androidreact-nativereact-navigation

解决方案

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

尝试改变YourScreenName。{screen: YourScreenName }对于您的每个导航器路线。

前任：

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

推荐阅读