一个屏幕上的多个堆栈导航器

Question

您如何使用React Navigation 5在一个Drawer.Screen上显示多个Stack.Navigators。

假设我有两种类型的产品：仪表板Drawer.Screen上的手机和平板电脑。手机和平板电脑代表一个单独的Stack.Navigators，如何将它们都显示在同一屏幕上？

Answer 1

您可以这样操作：

export const DrawerNavigator = props => {
  return (
    <Drawer.Navigator
      drawerContent={props => <DrawerScreen {...props} />}
      initialRouteName={'HomeScreen'}
      drawerPosition={'right'}
      drawerStyle={{width: '100%', backgroundColor: 'transparent'}}
      screenOption={{backBehavior: 'order'}}>
      <Drawer.Screen
        name="App"
        component={isMobile ? MobileStackNavigator :     tabletStackNavigator}
        options={{gestureEnabled: false}}
      />
    </Drawer.Navigator>
  );
};