Реагировать на собственную пользовательскую навигацию по компонентам заголовка

Question

Я использую реагирующую навигацию и пытаюсь реализовать собственный заголовок, который будет виден на каждой странице. попытался последовать примеру по этой ссылке и все хорошо. Мой заголовок отображается, но теперь я пытаюсь вернуться на главный экран, используя ссылку HOME, в заголовке навигации не происходит.

React Native: React Navigation - использовать тот же компонент заголовка на каждом экране?

При отладке моего компонента заголовка я могу четко видеть реквизит навигации, но не уверен, почему он не перемещается. Мой код ниже. любая помощь приветствуется.

Создание стека навигатора

const AppNavigator = createStackNavigator({
 Home: {
  screen: MeetingList,    

 },
 MeetingDisplay: {
  screen: MeetingDisplay
 }
 },{
   initialRouteName: "Home",
   defaultNavigationOptions: ({ navigation }) => {
       return MyHeader(navigation)
   }  
 });

Пользовательский компонент заголовка

const MyHeader = (navigation) => {
   return {
       header: props => <Header navigation= {navigation} />,
       headerStyle: { backgroundColor: '#000' },
       headerTintColor: '#000',
   };
 }

Мой компонент заголовка

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

class Header extends React.Component {
    constructor(props) {
       super(props);
       /  /this.params = props.navigation.state.params;
       this.state = {

       }        
     }

render() {
    const { navigation } = this.props;
    return (
        <>
            <View>
                <Text onPress={()=> navigation.navigate('MeetingList')}>HOME</Text>
            </View>
        </>
    )
   }
}

 export default Header;

Answer 1

изменить

 onPress={()=> navigation.navigate('MeetingList')}

на

onPress={()=> navigation.navigate('Home')}

то, что вы делаете неправильно, вы передаете экранное имя, вы должны передать имя маршрута, с которым вы определяете экран .

Надеюсь, это поможет!