DrawerNavigator 中的 StackNavigator答案

【问题标题】：StackNavigator in DrawerNavigatorDrawerNavigator 中的 StackNavigator
【发布时间】：2018-12-24 21:35:05
【问题描述】：

我在我的 react native 应用程序中使用 React Navigation，并且我有一个简单的路线，HomeScreen 和 QScreen 应该可以访问抽屉，但 SplashScreen 和 LoginScreen 没有！

我该怎么做？

此代码不起作用并在HomeScreen（在SplashScreen 中调用）的读取参数中引发错误：

const MainStack = createStackNavigator({
        HomeScreen: { screen: HomePage, navigationOptions: noHeadersNavigationOptions },
        QScreen: { screen: QPage, navigationOptions: noHeadersNavigationOptions },

},  {
        initialRouteName: 'HomeScreen',
    });

const DrawerStack = createDrawerNavigator({
        MainStack ,
}, {
        initialRouteName: 'MainStack',
    });

const Router = createStackNavigator({
    SplashScreen: { screen: SplashScreenPage },
    LoginScreen: { screen: LoginPage },
    HomeScreen: DrawerStack,
},  {
        initialRouteName: 'SplashScreen',
    }
);

export default createAppContainer(Router);

在SplashScreenPage：

  const resetAction = StackActions.reset({
    index: 0,
    actions: [NavigationActions.navigate({ routeName: 'HomeScreen', params: params  })],
  });
  this.props.navigation.dispatch(resetAction);

【问题讨论】：

标签： react-native react-navigation stack-navigator

【解决方案1】：

我使用这种导航结构获得了类似的结果：

主开关
- 登录页面
- 主抽屉
  - 第1页
  - 第2页
  - 第3页

这是一个工作示例：

https://snack.expo.io/@sanjar/c28tNT

【讨论】：

你使用 switchNavigator 没有将参数传递给嵌套堆栈！