undefined is not a function(evaluating'_this.props.navigation.navigate')

Question

I'm trying to get access to 'Home' from Form.js. But my code shows that error. How can I fix it?

I tried in arrowF, routes and nothing works. Same error...

This is my Form.js where I call onPress=() I tried function, navigation and nothing works. I try add const { navigation } = this.props; and nothing works. Same error.

<View style={styles.viewChild}>
  <TouchableHighlight
     onPress={this._Home} title="Home"
     style={styles.button} >
   <Text style={{color: '#fff', fontSize: 16}}>Acessar</Text>
 </TouchableHighlight> 

This is my Login.js. Where I call Component

 import React from 'react'; import { Container, Top, Logo, Title, Content } from './styles'; import Form from '~/components/Form/form'; import logo from '~/assets/logo.png'; import { MaterialTopTabBar, navigation } from 'react-navigation'; export default function Login(){ return ( <Container> <Top> <Logo source={logo} /> <Title style={MaterialTopTabBar.display1} >Welcome</Title> </Top> <Content> <Form /> </Content> </Container> ); } 

This is my Route.js I tried changes between Stack, BottomNav, and nothing works. The Route from Form.js to 'Home' failed. I can post my GitHub.

 import { createAppContainer, createSwitchNavigator, createStackNavigator } from 'react-navigation'; import Form from '~/components/Form/form'; import Home from '~/pages/Home/home'; import Main from '~/pages/Main'; const Routes = createAppContainer( createSwitchNavigator({ Main: {screen: Main}, Form: {screen: Form}, Home: {screen: Home, navigationOptions: { title: 'Home', headerBackTitle: null, }} }), ); export default Routes; 

Answer 1

The function is used as follows:

func1(){
    this.props.navigation.navigate("Form");
}
...
 <TouchableHighlight
     onPress={this.func1.bind(this)} title="Home"

or

 <TouchableHighlight
     onPress={() => this.func1()} title="Home"

use Arrow function

const func1 = () => {
    this.props.navigation.navigate("Form");
}
...
 <TouchableHighlight
     onPress={this.func1} title="Home"