異なるファイルでネイティブナビゲートに反応する

Question

反応ネイティブの初心者では、react-navigationをナビゲーションバーなしで別のファイルで使用する方法を見つけようとしています（たとえば、ログインビューのボタンをクリックしてメインログアウトボタンをクリックするとログインビューに戻ります）。

AppRegistry.registerComponent('myApp',() => Nav);

Navigator.jsにある間：

export const Nav = StackNavigator({ 
    Login: { screen: LoginView }, 
    AddStream: { screen: AddStreamView }, 
}); 

I iはグローバルコンポーネントのナビゲーション」を作り、iは主AppRegistry呼び出しに入れ反応ナビゲーションと

実行する react-native run-android 私は空白の下にロードされた最初のビューを取得する（それは私のアプリでは望んでいないナビゲータでなければならない）

これで、ビューからNavを削除するにはどうしたらいいですか？また、別のファイルのボタンコンポーネントをView onPressに変更するにはどうすればよいですか？

私の欲望を満たしてくれる別のパッケージがありますか？

Answer 1

From the docsに設定する場合は、headerModeをnoneに設定してください。これにより、そのStackNavigatorで定義されたすべての画面のヘッダーが非表示になります。例：あなたはそれが画面の一部に表示されますが、すべてではない彼らのように、ヘッダの可視性を制御したい場合は、あなたが

const Nav = StackNavigator({ 
    Login: { screen: LoginView }, 
    AddStream: { screen: AddStreamView }, 
},{ 
    headerMode: 'none', 
}); 

screenにheaderModeを設定し、個々のスクリーンセットのためにすることができます[ナビゲーションheader: { visible: false }のための小道具。 See docs here。たとえば、別のファイルで画面コンポーネントを作成する場合、次のようになります。

// In the main file: 
const Nav = StackNavigator({ 
    Login: { screen: LoginView }, 
    AddStream: { screen: AddStreamView }, 
},{ 
    headerMode: 'screen', 
}); 

// Hidden for your Login screen: 
export default class LoginView extends Component { 
    static navigationOptions = { 
     header: { visible: false } 
    } 
    // etc... 
} 

// Visible for your AddStream screen: 
export default class AddStreamView extends Component { 
    static navigationOptions = { 
     header: { visible: true } 
    } 
    // etc... 
} 

編集：質問の2番目の部分が欠落しています。
別の画面にナビゲートするには、実際にはthe Hello World tutorialまで行ってください。具体的には、this section。チュートリアルから関連するサンプルコード：あなたのケースでは

render() { 
    const { navigate } = this.props.navigation; 
    return (
     <View> 
      <Text>Hello, Chat App!</Text> 
      <Button 
      onPress={() => navigate('Chat')} 
      title="Chat with Lucy" 
      /> 
     </View> 
    ); 
} 

、'Chat'は'Login'または'AddStream'のどちらかだろう。