DrawerNavigator中的StackNavigator

Question

我在我的react本机应用程序中使用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);

Answer 1

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

• 主开关
  • LoginPage
  • 主抽屉
    • 第1页
    • Page2
    • Page3

这是一个有效的示例：

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