我试图隐藏后退箭头导航按钮，但它不起作用

Question

大家好，我正在尝试隐藏后退箭头导航按钮，但它不起作用

function MyStack(){
  return(
      <Stack.Navigator
       screenOptions={{
         headerTitle:null,
         headerTransparent:true,
         topBar:{
           backButton:{
                  noBorder: true,
                  backButton: {visible: false},
                  leftButtons: [],
           }
         }
       }}
      >
      <Stack.Screen name="Index" component={IndexScreen} />
      <Stack.Screen name="drawer" component={Drawer} />
    </Stack.Navigator>
  )
}

Answer 1

在

headerLeft: null

或

<Stack.Screen>

选项中设置

<Stack.Navigator>

，如下例所示。

function MyStack(){
  return(
      <Stack.Navigator
       screenOptions={{
         headerTitle:null,
         headerTransparent:true,
         headerLeft: null
       }}
      >
      <Stack.Screen options={{headerLeft: null}} name="Index" component={IndexScreen} />
      <Stack.Screen name="drawer" component={Drawer} />
    </Stack.Navigator>
  )
}

Answer 2

您需要在选项中设置

{headerBackVisible:false}

您可以将其添加到特定屏幕，如下所示

 <Stack.Screen options={{headerBackVisible:false}} name="Index" component={IndexScreen} />

或者您可以为所有页面制作

<Stack.Navigator
       screenOptions={{
         headerTitle:null,
         headerTransparent:true,
         headerLeft: null,
         headerBackVisible: false,
       }}
      >

Answer 3

{headerBackVisible:false} 这个对我有用。谢谢