React Native Navigation Sidebar 和 TabBar 切换导航

Question

我想在侧边栏和标签导航之间切换。我拥有它，因此它当前根据屏幕大小在选项卡和侧边栏之间切换，但是由于它们是单独的导航器，因此它会重置导航堆栈。有什么方法可以在我更改导航器时保留导航堆栈？

如果有办法让 Drawer 和 TabBar 导航器同时显示在相同的屏幕上，那也可以解决我的问题。

  <Stack.Navigator
      screenOptions={{ headerShown: false }}
      mode="modal"
      initialRouteName="WalkthroughScreen"
    >
      {deviceSize(layout.width) > 0 ||
      (layout.width < 50 && Platform.OS === 'web') ? (
        <Stack.Screen name="Root" component={DrawerNavigator} />
      ) : (
        <Stack.Screen name="Root" component={BottomTabNavigator} />
      )}

Answer 1

我最后做的只是为移动应用程序使用底部导航，为网络和移动网络使用抽屉式导航。所以我的代码看起来像这样：

      {Platform.OS === 'web' ? (
        <Stack.Screen name="Root" component={DrawerNavigator} />
      ) : (
        <Stack.Screen name="Root" component={BottomTabNavigator} />
      )}

之所以可行，而不是其他方式，是因为它只使用平台，所以导航器从来没有理由在进程中切换。所以我决定放弃选项卡，使用带有侧边抽屉的移动网络汉堡包菜单，并在大屏幕上使用永久侧边抽屉。

所以在我的抽屉导航器中 <DrawerNavigation.Navigator> 我这样设置 drawerType

      drawerType={deviceSize(layout.screenWidth) === 0 ? 'front' : 'permanent'}

React Native Navigation Sidebar 和 TabBar 切换导航

React Native Navigation Sidebar and TabBar toggled navigation

react-native-navigation

react-navigation

react-navigation-v5