使用onpress在屏幕之间导航

Question

我试图在屏幕之间导航并显示错误

  

undefined不是对象（评估'props.navigation.navigate'）

App.js

const AppNavigator = createStackNavigator({
  FormLoginScreen: { screen: FormLogin },
  FormCadastroScreen: { screen: FormCadastro },
  AdicionarContatoScreen: {
    screen: FormAdicionarContato, navigationOptions: () => ({
      title:"Adicionar Contato",
    }),
  },
});

TabBarMenu.Js

import React from 'react';
import { View, Text, StatusBar, Image, TouchableHighlight } from 'react-native';

export default props => (
    <View style={{ backgroundColor: "#115E54" }}>

        <StatusBar backgroundColor='#114D44' />

        <View style={{ flexDirection: 'row', justifyContent: 'space-between' }}>
            <View style={{ height: 50, justifyContent: 'center' }}>
                <Text style={{ color: "#fff", fontSize: 20, marginLeft: 20 }}>Whatsapp Clone</Text>
            </View>

            <View style={{ flexDirection: 'row' }}>

                <View style={{ justifyContent: 'center', width: 50 }}>
                    <TouchableHighlight onPress={() => props.navigation.navigate('FormCadastroScreen')}>
                        <Image source={require('../imgs/adicionar-contato.png')} />
                    </TouchableHighlight>
                </View>

                <View style={{ justifyContent: 'center' }}>
                    <Text style={{ fontSize: 20, color: '#fff' }}> Sair </Text>
                </View>
            </View>
        </View>
    </View >
);

在TouchableHighlight按钮中有一个onPress事件，我用它导航到另一个屏幕，然后显示上面的错误。为什么会这样？我该如何解决？