2017-03-16 19 views
26

反応ネイティブナビゲーション(反応ナビゲーション)StackNavigatorを使用しています。 アプリのライフサイクル全体を通じてログインページから開始します。私はバック・オプションを望んでいない、ログイン画面に戻ります。誰もがログイン画面の後に画面にどのように隠れることができるか知っていますか? はところで、私も使ってログイン画面でそれを隠しています:反応ネイティブナビゲーションで戻るボタンを無効にする

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

答えて

58

反応し、ナビゲーション・バージョン> = 1.0.0-beta.9ために、戻るボタンが消えるようにしますあなたは)からナビゲートしたいから、画面上にある:

import { NavigationActions } from 'react-navigation'; 

とすべてのバック機能が無効になっています、目標ルートにナビゲートする機能を使用します。

その後、3210

、あなたはiOSの

+14

これはあなたが2017年なら正しい答えです – mixdev

+2

これは戻るボタンを削除しますが、アンドロイドではまだデバイスの戻るボタンを使用してナビゲートできます。それも無効にする方法はありますか? –

+3

はい、回答を更新しました。 –

3

はそれを自分自身を発見した;) を追加:

left: null, 

ボタンをデフォルトに戻って無効にします。

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

あなたはleft:nullを使用して[戻る]ボタンを非表示にすることができますが、Androidデバイスのために、それはまだ、ユーザーが戻るボタンを押したときに戻って行くことができます。 、このソリューションはreact-navigator 1.0.0-beta.7のために働くhttps://reactnavigation.org/docs/navigators/navigation-actions#Reset

しかしleft:nullは、もはや最新バージョンのために働く:あなたは、ナビゲーション状態をリセットするためのドキュメントではない。ここleft:null

でナビゲーション状態をリセットし、ボタンを非表示にする必要があります。あなたもナビゲーションスタックをきれいにしたい場合は、このような何かを行うことができ、

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

を(仮定:

+4

、目標ルートにナビゲートしたい場合、あなたはまだスライドできる this.resetNavigation('myRouteWithDisabledBackFunctionality') を呼び出します画面の端からポップバックします。ナビゲーション状態を再設定することは間違いなく必要です。 – cameronmoreau

1

反応し、ナビゲーションをバージョン> = 1.0.0-beta.9

navigationOptions: { 
headerLeft: null} 
関連する問題