小能豆

在反应导航中禁用后退按钮

javascript

我正在使用 React Native 导航 (react-navigation) StackNavigator。它从登录页面开始,贯穿应用程序的整个生命周期。我不想有返回选项,返回到登录屏幕。有人知道如何在登录屏幕后将其隐藏在屏幕上吗?顺便说一句,我也使用以下方法将其隐藏在登录屏幕中:

const MainStack = StackNavigator({
  Login: {
    screen: Login,
    navigationOptions: {
      title: "Login",
      header: {
        visible: false,
      },
    },
  },
  // ... other screens here
})

阅读 70

收藏
2024-06-05

共1个答案

小能豆

要在登录屏幕后隐藏 React Navigation 中的后退按钮,您可以使用您不希望后退按钮出现的屏幕headerLeft上的选项navigationOptions。操作方法如下:

const MainStack = StackNavigator({
  Login: {
    screen: Login,
    navigationOptions: {
      title: "Login",
      header: null, // Hide the header completely on the login screen
    },
  },
  OtherScreen: {
    screen: OtherScreen,
    navigationOptions: {
      title: "Other Screen",
      headerLeft: null, // Hide the back button on this screen
    },
  },
  // other screens here
});

在上面的代码中:

  • 对于Login屏幕,通过设置可以隐藏整个标题header: null
  • 对于您不希望显示后退按钮的任何其他屏幕,您可以headerLeft: null在 中进行设置navigationOptions。这将隐藏专门针对该屏幕的后退按钮。

通过设置headerLeft: null,后退按钮将不会显示在该屏幕的标题栏上,从而有效地消除了后退导航的能力。

2024-06-05