React Native：从导航堆栈中删除后退按钮？

Posted 2023-02-22

【中文标题】React Native：从导航堆栈中删除后退按钮？

【英文标题】：React Native: Remove a back button from navigation stack?

【发布时间】：2020-05-24 16:34:17

【问题描述】：

所以我有一个不断向其中添加页面的导航堆栈。用户可以转到上一页或下一页。就像一个注册页面。

例如，这里是一个有 3 个屏幕的页面（上一页、当前页、下一页）

function MyStack() 
  const Stack = createStackNavigator();
  return (
    <Stack.Navigator>
      <Stack.Screen
        name="Current"
        component=ContentFunction
        options=headerTransparent: true, headerTitle: ''
      />
      <Stack.Screen name="Back" component=BackFunction />
      <Stack.Screen
        name="Next"
        component=FirstNamePage
        options=
          headerTransparent: true,
          headerTitle: '',
          headerBackTitle: 'Gender',
        
      />
    </Stack.Navigator>
  );

问题是，按钮堆叠在一起。见下文。

我需要删除旧按钮，但我不知道该怎么做。当然我可以通过设置来做到这一点：

   <Stack.Screen
        name="Next"
        component=FirstNamePage
        options=
          headerLeft: null
        
      />

但我不能这样做，除非我在那个特定的功能上。我该怎么做？

【参考方案1】：

试试这个

    <Stack.Navigator
      screenOptions=
        headerShown: false
      
    >

  <Stack.Screen name="route-name" component=ScreenComponent />
</Stack.Navigator>

参考：- Hide header in stack navigator React navigation