禁用反应原生导航中的后退按钮

Question

我正在使用反应原生导航（react-navigation）StackNavigator。 它从应用程序的整个生命周期中的登录页面开始。我不想有返回选项，返回登录屏幕。有没有人知道如何在登录屏幕后隐藏在屏幕上？ 顺便说一句，我也用它隐藏在登录屏幕：

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

Answer 1

对于反应导航版本> = 1.0.0-beta.9，使后退按钮消失：

navigationOptions: { 
    title: 'MyScreen', 
    headerLeft: null 
} 

如果你想清理导航堆栈过，你可以做这样的事情（假设你是从哪个你想从导航）在屏幕上：

import { NavigationActions } from 'react-navigation'; 

和使用功能导航到这将有全部回功能禁用目标路线：

resetNavigation(targetRoute) { 
    const resetAction = NavigationActions.reset({ 
    index: 0, 
    actions: [ 
     NavigationActions.navigate({ routeName: targetRoute }), 
    ], 
    }); 
    this.props.navigation.dispatch(resetAction); 
} 

，然后调用 this.resetNavigation('myRouteWithDisabledBackFunctionality') 当你想在iOS上你仍然可以滑动导航到目标路径

Answer 2

发现它自己;） 补充说：

left: null, 

禁用默认后退按钮。

const MainStack = StackNavigator({ 
    Login: { 
    screen: Login, 
    navigationOptions: { 
     title: "Login", 
     header: { 
     visible: false, 
     }, 
    }, 
    }, 
    FirstPage: { 
    screen: FirstPage, 
    navigationOptions: { 
     title: "FirstPage", 
     header: { 
     left: null, 
     } 
    }, 
    }, 

Answer 3

您可以隐藏使用left:null后退按钮，但对于Android设备，它仍然能够在用户按下后退按钮回去。你需要重新设置导航状态和隐藏与left:null

按钮下面是重置导航状态的文档：https://reactnavigation.org/docs/navigators/navigation-actions#Reset

该解决方案适用于react-navigator 1.0.0-beta.7，但是left:null不再适用最新的版本。

Answer 4

反应导航版本> = 1.0.0-beta.9

navigationOptions: { 
headerLeft: null}