Я хочу перейти с одного экрана на другой, но у меня не определено не является объектом (оценка 'this.props.navigation.navigate')

Question

Я хочу перейти от одного окна навигации к другому экрану, но у меня появляется ошибка

Ошибка типа: undefined не является объектом (оценивается как this.props.navigation.navigate)

не знаю почему?

Вот мой код:

import React, { useState } from 'react';
import { View } from 'react-native';
import { Drawer, Appbar, Divider } from 'react-native-paper';
import style from './menu.style';
import popularposts from './popularposts';

export default Menu = ({onMenuToggle, options, navigation}) => {
    const [active, setActive] = useState('home');
    const {navigate} = this.props.navigation;
    return (
       <View style={style.container}>
       <Appbar.Header>
            <Appbar.Content></Appbar.Content>
            <Appbar.Action icon="close" onPress={onMenuToggle} />
        </Appbar.Header>
            <Drawer.Section>
             <Drawer.Item
                label="Popular Post"
                active={active === 'first'}
                onPress={() => navigate('popularposts')}
                />
                <Drawer.Item
                label="Important Dates/ Events"
                active={active === 'second'}
                onPress={() => { setActive('second'); }}
                />
                <Divider />
                <Drawer.Item
                label="SIGN OUT"
                active={active === 'fourth'}
                onPress={() => { setActive('fourth'); }}
                />
            </Drawer.Section>
       </View>
    )
}

Answer 1

Используйте

const {navigate} = navigation;

Вместо

const {navigate} = this.props.navigation;