我有一个像这样的自定义标题

import React from 'react';
import { View, TouchableOpacity, Text, StyleSheet, Image } from 'react-native';
import { Header, Left, Right, } from 'native-base';
import { Icon } from 'react-native-elements';

export default class MainHeader extends React.Component {

pressSearch() {
    this.props.navigation.navigate('Login');
}
render () {
    return(
        <Header style={{paddingTop:25}}>
            <Left style={{marginBottom:10}}>
                <TouchableOpacity>
                    <View style={{flexDirection:'row'}}>
                        <Image
                            style={styles.stretch}
                            source={require('../images/logoforplay.png')}
                        />
                        <Text style={styles.headerText} > Eventlinn </Text>
                    </View>
                </TouchableOpacity>
            </Left>
            <Right>
                <TouchableOpacity
                    style={styles.headerButton}
                    onPress={this.pressSearch.bind(this)}
                >
                    <Icon
                        name={'search'}
                    />
                </TouchableOpacity>
                <TouchableOpacity
                    style={styles.headerButton}
                >
                    <Icon
                        name={'add-location'}
                    />
                </TouchableOpacity>
                <TouchableOpacity
                    style={styles.headerButton}
                >
                    <Icon
                        name={'notifications'}
                    />
                </TouchableOpacity>
            </Right>
        </Header>


      )
    }
}
const styles = StyleSheet.create ({
    mainContainer: {
        flex:1,
        backgroundColor:'white'
    },
    cardContainer: {
        flex:1
    },
    stretch: {
        height:35,
        width:35,
    },
    headerText: {
        fontSize:24,
        marginTop:3,
    },
    headerButton: {
        marginBottom:10,
        marginLeft:15
    }
})

我的问题 navigation.navigate 不起作用。我的路由器工作正常，因为我可以使用另一个屏幕导航到“登录”。我阅读了一些关于纯组件的内容，但仍然不明白如何解决这个问题。你有什么建议？顺便说一下，我是 React Native 的新手。