反应导航 - 在选项卡之间跳转

Question

大家好，我的标签栏中有5个容器，如果我选择另一个标签容器，我想知道是否有返回主屏幕的选项。

所以我有以下内容

https://snack.expo.io/@react-navigation/stacks-in-tabs-v3

当我在Home标签时，我点击Go to Details然后我切换到Settings标签。如果我回到Home容器，我想看到默认屏幕是HomeScreen

有选择吗？

Answer 1

您可以重新定义每个tabBarOnPress的navigationOptions的StackNavigator，如下所示：

const stacks = [
  { Home: HomeScreen, Details: DetailsScreen },
  { Settings: SettingsScreen, Details: DetailsScreen }
].reduce((stacksObj, stack) => {
  const initialRoute = Object.keys(stack)[0];
  stacksObj[initialRoute] = createStackNavigator(
    stack,
    {
      navigationOptions: {
        tabBarOnPress: ({ navigation }) => navigation.navigate({
          routeName: initialRoute,
          action: navigation.popToTop()
        })
      }
    }
  );
  return stacksObj 
}, {});

export default createAppContainer(createBottomTabNavigator(
  stacks,
  { /* same defaultNavigationOptions as the snack example */ }
));

Answer 2

因为你的DetailScreen嵌套在堆栈Home中，你必须再导航一个级别到那个屏幕

  _navigateHome = () => {
    const navigateAction = NavigationActions.navigate({
      routeName: 'Home',
      action: NavigationActions.navigate({ routeName: 'Home' }),
    });
    this.props.navigation.dispatch(navigateAction);
  }