0

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

これは私のコードです

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"
  }
);

};

ナビゲーション変数を宣言しようとしましたが、機能しません

スクリーンショット

ホーム画面

エラー画面

ありがとう。

4

2 に答える 2

0 
import {Button ,TouchableOpacity,Image} from 'react-native';

import {createMaterialTopTabNavigator} from 'react-navigation-tabs';


const AppTabNavigator = createMaterialTopTabNavigator(
    {
        AlertDetails: AlertDetails,
        Comments: Comments,
    },
    {
        navigationOptions:{
          title:"Alert Details",
          headerRight: <TouchableOpacity style={ [{paddingHorizontal:15}] }
                          onPress={() => alert('Three Dot Icon') }>
                          <Image
                               style={{height: 20, width :30,marginTop:10 ,marginLeft:30,marginRight:10 , justifyContent: 'center'}}
                               resizeMode="contain"
                               source={require('../assets/icons/three_dot.png')}>
                          </Image>
                    </TouchableOpacity>,
          headerLeft: <Button   style={{ marginRight:40, paddingRight:40,}}  title=":" title=":" onPress={()=> alert('Left  button 2')}  />,
        },
        tabBarOptions: {
            activeTintColor: 'white',
            showIcon: false,
            showLabel:true,
            style: {
                backgroundColor: colorTheme,
//                borderTopWidth: 3,
//                borderTopColor:'#465456'
            },
            indicatorStyle: {
                backgroundColor: 'blue',
                height : 2,
            },
        },
    }
);
于 2019-12-12T05:28:20.027 に答える