导航到嵌套导航屏幕后，无法返回或查看嵌套导航初始路线

Question

我在我的应用程序中使用了 MainBottomTabNavigation 和 StackNavigation。这是我的导航布局

主底部选项卡导航

• 仪表板屏幕
• 屏幕 1（堆栈导航）
  • 屏幕A（初始页）
  • 屏幕B

在我的仪表板屏幕中，我有一个从仪表板导航到屏幕 B 的组件。第一次登录应用程序时，如果从该组件从仪表板导航到屏幕 B，则我无法在正常导航中查看屏幕 1流程，仅出现屏幕 B。

如果我最初转到屏幕 A，然后从仪表板转到嵌套导航，则一切正常。

<Tab.Navigator
 initialRouteName="Home">
      <Tab.Screen
        name="Home"
        component={Dashboard}
        options={{tabBarLabel: 'Dashboard'}}
      />
      <Tab.Screen
        name="Screen1"
        component={Screen1}
        options={{tabBarLabel: 'Screen 1', headerShown: false}}
      />
    </Tab.Navigator>

堆栈导航屏幕 1

<Stack.Navigator
  initialRouteName="StackHome">
      <Stack.Screen
        name="ScreenA"
        component={StackHomeScreen}
      />

      <Stack.Screen name="ScreenB" component={ScreenBScreen} />


    </Stack.Navigator>

嵌套导航代码

          <TouchableOpacity
            onPress={() => {
              navigation.navigate('StackHome', {
                screen: 'ScreenB',
              });
            }}>

React 导航版本

    "@react-navigation/bottom-tabs": "^6.5.11",
    "@react-navigation/material-top-tabs": "^6.6.6",
    "@react-navigation/native": "^6.1.9",
    "@react-navigation/native-stack": "^6.9.17",

Answer 1

尝试使用 CommonActions.reset 而不是导航

import { CommonActions } from '@react-navigation/native';

navigation.dispatch(
  CommonActions.reset({
    index: 1,
    routes: [
      {
        name: 'StackHome',
        params: { screen: 'ScreenA' },
      },
      {
        name: 'StackHome',
        params: { screen: 'ScreenB' },
      },
    ],
  })
);