禁用反應原生導航中的後退按鈕

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}