React native drawer navigation not working on button click

Question

I have added a code for my drawer navigation but it seems not working. can someone please help me out with this.

DrawerNavigation.js

import React from 'react';
import { AppRegistry} from 'react-native';
import { createDrawerNavigator } from 'react-navigation';
import { Icon } from 'react-native-elements';

import link from '../link';
export const Drawer = createDrawerNavigator({
    link: {
        screen: link,
        navigationOptions: {
            drawerLabel: "Drawer Item 1",
            drawerIcon: ({ tintColor }) => <Icon name="rocket" size={24} />
        },
    }
});

AppRegistry.registerComponent('myapp', () => Drawer);

In navigator/index.js I am calling DrawerOpen onPress function for the hamburger button i have created on the left side.

import React from 'react';
import {createStackNavigator} from 'react-navigation';
import { Icon } from 'react-native-elements';
import { ScrollView, Text, StyleSheet, View, Button} from 'react-native';
import { TouchableOpacity } from 'react-native';
import IOSIcon from "react-native-vector-icons/Ionicons";


import {Tabs} from "./TabbedNavigation";
import {Drawer} from "./DrawerNavigation";

export default createStackNavigator({
    Tabs: {
        screen: Tabs,
        navigationOptions: ({ navigation }) => ({
                title: 'Flurry Fit',
                //headerLeft:<Icon name="menu" size={30} iconStyle={{padding: 8}} onPress={ () => navigation.navigate('DrawerOpen') } />,
                headerLeft:(
              <TouchableOpacity onPress={() => navigation.navigate('DrawerOpen')}><!-- Button click event seems having an issue. -->
                <IOSIcon name="ios-menu" size={30} />
              </TouchableOpacity>
            ),
              headerRight:<Button onPress={() => alert('Link to Map')} title="Map" color="#000" style={{fontSize: 14}}/>,
                    })
    },
},
{
    //mode: 'modal',
    //headerMode: 'screen',
});

Charles Owen · Accepted Answer · 2018-11-22 02:39:09Z

2

I'm not sure what you mean by 'not working.' But I use the toggleDrawer() method to show/hide the drawer menu.

  import { createStackNavigator,createDrawerNavigator, DrawerItems, SafeAreaView  } from 'react-navigation';

 onPress={()=> navigation.toggleDrawer()}

answered Nov 22, 2018 at 2:39

Charles Owen

2,9802 gold badges24 silver badges31 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

React native drawer navigation not working on button click

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related