Linked Questions

Popular Questions

Can't find variable: DrawerActions

Asked by At

I am very new to react-native. I am making a sample app having drawer navigation along with stack navigation. I am getting error again and again in drawer code in the drawer button. How do I open and close my drawer? I have tried to search a lot on internet. And tried whatever I got. But nothing helped. Any help is appreciated. I have written the following code:

import React, {Component} from 'react';
import {createDrawerNavigator, createStackNavigator, createAppContainer} from 'react-navigation';
import {TouchableOpacity, Text} from 'react-native';
import Signup from './Screens/Signup'; 
import SignIn from './Screens/SignIn';
import TradeType from './Screens/TradeType';
import SState from './Screens/SState';
import IState from './Screens/IState';
import Result from './Screens/Result';
import Home from './Screens/Home';
import DrawerTbl from './Screens/DrawerTbl';

export const Drawer = createDrawerNavigator({
  SignIn: {screen: SignIn},
  Home: {screen: Home},
}, {
  initialRouteName: 'SignIn',
  contentComponent: 'DrawerTbl',
  drawerWidth: 300
});

export const Stack = createStackNavigator({
  SignIn: {screen: SignIn,
  navigationOptions: ({navigation}) => ({
     headerLeft:(
        <TouchableOpacity onPress={() => navigation.dispatch(DrawerActions.toggleDrawer())}>
          <Text>Drawer</Text>
        </TouchableOpacity>
     ),
   })
 },
   Signup: {screen: Signup},
   Home: { screen: Home },
   Drawer: { screen: Drawer },
   DrawerTbl: { screen: DrawerTbl },
   Trade: { screen: TradeType },
   SState: { screen: SState },
   IState: { screen: IState },
   Result: { screen: Result } 
 },
 {
    initialRouteName: "SignIn",
 });

const AppC = createAppContainer(Stack);

class App extends Component {
  render() {
    return(
     <AppC/>
    );
  }
}

export default App;

I am getting the following error: Can't find variable: 'DrawerActions'.

Try1:

navigationOptions: ({navigation}) => ({
  headerLeft:(
    <TouchableOpacity onPress={() => navigation.toggleDrawer()}>
      <Text>Drawer</Text>
    </TouchableOpacity>
  ),
})

Got error:

Undefined is not a function(evaluating'navigation.toggleDrawer()')  

Try2:

this.props.navigation.openDrawer()  

Got error in this also.

Related Questions