React native React导航HeaderRight onPress处理程序抛出错误

我试图使用react navigation实现一个onPress处理程序，它允许我导航到一个名为tasks的屏幕

下面的代码显示headerRight很好。但是，当我单击headerRight按钮时，会出现以下错误

“Undefined不是我的expo模拟器上的对象（评估2.props.navigation）”

有人知道我的onPress处理程序出了什么问题吗？Tq

static navigationOptions = {
    title: 'List',

    headerRight: (
        <Button
         title='Add Task'
         onPress={() => this.props.navigation.navigate('task')}
         backgroundColor='rgba(0,0,0,0)'
         color='rgba(0,122,255,1)'
        />) 

}

静态导航选项={
标题：“列表”，
头灯：(
this.props.navigation.navigate（'task'）}
backgroundColor='rgba（0,0,0,0）'
color='rgba（0122255,1）'
/>) 
}

我设法让代码正常工作

希望这能帮助那些使用react导航并希望呈现可行头灯的人

static navigationOptions = ({navigation}) => ({
    title: 'List',
    headerRight: <Button
        title= 'Add Task'
        onPress={() => navigation.navigate('task')}
        backgroundColor='rgba(0,0,0,0)'
        color='rgba(0,122,255,1)'
    />
});

静态导航选项=（{navigation}）=>({
标题：“列表”，
headerRight:navigation.navigate（'task'）}
backgroundColor='rgba（0,0,0,0）'
color='rgba（0122255,1）'
/>
});