ヘッダーの右端のボタンからナビゲートする - React Native

Question

ヘッダーボタンからナビゲートしようとしていますが、ナビゲーション変数が見つからないため、できません。

これは私のコード

export const createRootNavigator = (signedIn = false) => { 

return StackNavigator(
    { 
    SignedIn: { 
     screen: SignedIn, 
     navigationOptions: { 
     gesturesEnabled: false, 
     headerStyle, 
     headerTintColor: "white", 
     headerTitleStyle, 
     headerLeft: null, 
     headerRight: <TouchableOpacity style={ [{paddingHorizontal:15}] } 
         onPress={() => navigation.navigate({ routeName: 'Notification'})}> 
         <Icon 
          name="md-notifications-outline" 
          size={26} 
          style={{ color: "white" }}/> 
         </TouchableOpacity>, 


     } 
    }, 
    SignedOut: { 
     screen: SignedOut, 
     navigationOptions: { 
     gesturesEnabled: false 
     } 
    }, 
    Notification: { 
     screen: Notification, 
     navigationOptions: { 
     gesturesEnabled: false 
     } 
    } 
    }, 
    { 
    mode: "modal", 
    initialRouteName: signedIn ? "SignedIn" : "SignedOut" 
    } 
); 

}です。

私は、ナビゲーション変数を宣言しようとしたが、それは

スクリーンショット

home screen

error screen

おかげで動作しません。

Answer 1

あなたがそうのような静的navigationOptions関数にそれを追加する必要があります。

static navigationOptions = ({ navigation }) => { 
    return { 
    headerRight: <TouchableOpacity style={ [{paddingHorizontal:15}] } 
        onPress={() => navigation.navigate({ routeName: 'Notification'})}> 
        <Icon 
         name="md-notifications-outline" 
         size={26} 
         style={{ color: "white" }}/> 
        </TouchableOpacity>, 
    ... and so on 
    } 
}; 

それともこれにあなたの一番上の行を変更します。このことができます

export const createRootNavigator = (signedIn = false, { navigation }) => { 

希望を！