反应本机导航 v5 导航选项卡在底部栏内答案

【问题标题】：React native navigation v5 navigate tab inside bottomBar反应本机导航 v5 导航选项卡在底部栏内
【发布时间】：2020-10-06 06:38:59
【问题描述】：

我已经构建了一个具有“列表模式”和“项目模式”的应用程序。在列表模式下，您有一个“项目”列表。当你选择一个项目时，你会在一个详细视图中导航，该视图有一个带有标签的底部栏 (@react-navigation/bottom-tabs)。

现在，当我处于列表模式时，使用 react-navigation v4 我能够在列表中导航并登陆特定选项卡，但我不明白如何使用 react-navigation v5 做到这一点。

我基本上有这个结构

<NavigationContainer>
  <Stack.Navigator headerMode="none">
    <Stack.Screen name="List" component={ItemsScreen} />

    <Stack.Screen name="Item" component={MainTabNavigator} />
  </Stack.Navigator>
</NavigationContainer>;

我可以轻松导航

<Stack.Screen name="ItemDetail" component={ItemDetailScreen} />;

但是，如果我这样做，我会在主视图中导航它，而不是在底部栏中。

关于如何在选择第二个选项卡的项目模式下移动应用程序的任何想法？

【问题讨论】：

标签： react-native react-navigation react-native-navigation

【解决方案1】：

您必须在如下导航时指定屏幕

这里的“选项卡”是堆栈中包含选项卡导航器的屏幕，“设置”是选项卡中的屏幕。这将导航到选项卡屏幕并切换到设置选项卡。

<Button title="Navigate" onPress={()=>navigation.navigate('tabs',{screen:'Settings'})}/>

【讨论】：