React native custom Drawer navigation - react-native

Question

I have created Custom DrawerNavigator. Everything is in place. But, I am not able to navigate between screens. I do not know how to navigate so i follow instructions at https://github.com/kakulgupta/CustomDrawer/tree/master/app. But this did nt help
import React,{Component} from 'react'
import {Text,View,StyleSheet,Image,NavigationActions} from 'react-native'
import {Icon,Container,Header,Content,Left} from 'native-base'
export default class Head extends Component{
navigateToScreen = (route) =>()=>{
const navAction = NavigationActions.navigate({
routeName:route
})
this.props.navigation.dispatch(navAction)
}
render(){
return (
<View>
<View style={styles.image}>
<Image
style={{height:200,
width:90,
marginLeft:'30%',
marginRight:'30%',
marginTop:'15%',
alignContent:'center',
alignItems:'center'
}}
source={require('./../images/logo.png')}
/>
</View>
<View style={styles.menu}>
<View style={styles.box} >
<Icon name="person" />
<Text style={styles.boxText} onPress={this.navigateToScreen("Login")}>Login</Text>
</View>
</View>
</View>
)
}
}
And my app.js is
import React, {Component} from 'react';
import {DrawerNavigator} from 'react-navigation'
import Login from './src/Login/login.js'
export default class App extends Component{
render(){
return(
<Links />
)
}
}
const Links = DrawerNavigator({
Login:{screen:Login},
},{contentComponent:props => <Slider {...props}/>
})
package.json
"dependencies": {
"native-base": "^2.8.0",
"react": "^16.4.1",
"react-native": "^0.55.4",
"react-navigation": "^2.12.1"
},
And the error is
undefined is not an object (evaluating
'_reactNative.NavigationActions.navigate')
Any help please.

Answer 1

You've imported NavigationActions from wrong place, you need to import it from react-navigation
import {NavigationActions} from 'react-navigation'