通过在标题上按下图像来导航嵌套屏幕

Question

我正在尝试在两个嵌套屏幕之间切换：HomeScreen.js和MessageScreen.js。两者都嵌套在Apps.js的同一堆栈导航器中。

我希望通过按Home.js标题中的图像从MessageScreen.js导航到Home.js。但是，会弹出错误消息，提示“ TypeError：未定义不是对象（正在评估'HomeScreen 这是Home.js中的标头代码：

...
export default class HomeScreen extends React.Component{ 

  static navigationOptions = () => ({
    title:'As minhas viagens',
    headerTintColor:'black',
    headerRight: ()=>  
        <TouchableOpacity onPress={() => this.props.navigation.navigate('MessageScreen')}>
            <Image 
            source={require("../assets/message.png")} 
            style={{width: 40,height: 40, borderRadius: 40 / 2}}/>
        </TouchableOpacity>
});
...

这是Stack Navigator，它嵌套在App.js中的Bottom Tab Navigator中：

...
const HomeStack = createStackNavigator({
  HomeScreen: {
    screen: HomeScreen,
    navigationOptions: () => ({
        headerShown: true
    })
  },
  MessageScreen: {
    screen: MessageScreen,
    navigationOptions: () => ({
      headerShown: true
    })
  }
});

const AppContainer = createBottomTabNavigator (
      {
        Home: {
          screen: HomeStack,
          navigationOptions: {
            tabBarIcon: ({ tintColor }) => <Ionicons name='ios-locate' size={24} color={tintColor}/>
          }
        },
...