如何删除另一个堆栈的屏幕C中另一个堆栈的屏幕A的背景屏幕

问题描述 投票:2回答:1

我有以下堆栈导航器。

导航容器

const ContentStack = createStackNavigator();

<NavigationContainer>
    <ContentStack.Navigator
      initialRouteName="SceeenAStack"
      headerMode="float"
      screenOptions={{
        header: props => {
          return <CustomHeader {...props} />;
        },
      }}>
          <ContentStack.Screen name="SceeenAStack" component={TabA} />
          <ContentStack.Screen name="ScreenBStack" component={TabB} />
    </ContentStack.Navigator>
</NavigationContainer>

嵌套堆栈1

const SceeenAStack = createStackNavigator();

<SceeenAStack.Navigator
      initialRouteName="ScreenA"
      headerMode="none"
      screenOptions={{
        gestureEnabled: true,
      }}>

        <SceeenAStack.Screen
           name="ScreenA"
           component={ScreenA}
        />
        <SceeenAStack.Screen
           name="ScreenB"
           component={ScreenB}
        />

</SceeenAStack.Navigator>

嵌套堆栈2

const ScreenBStack = createStackNavigator();

<ScreenBStack.Navigator
      initialRouteName="ScreenC"
      headerMode="none"
      screenOptions={{
        gestureEnabled: true,
      }}>

        <ScreenBStack.Screen
           name="ScreenA"
           component={ScreenC}
        />
        <ScreenBStack.Screen
           name="ScreenB"
           component={ScreenD}
        />

</ScreenBStack.Navigator>

screenA的屏幕(正文)位于SceeenAStack的ScreenB中。

如何删除它?

这是屏幕截图:

ScreenA of ScreenAStackScreenC of ScreenBStack

注意,背景中出现的图标不属于ScreenA标题的一部分。

react-native react-navigation react-navigation-v5
1个回答
0
投票

在这种情况下,请勿使用navigate()push()。使用replace()

来自文档的示例:

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

navigation.dispatch({
  ...StackActions.replace('Profile', {
    user: 'jane',
  }),
  source: route.key,
});
© www.soinside.com 2019 - 2024. All rights reserved.