реагировать на вызов функции кнопки заголовка навигации внутри tabnavigator

Question

У меня есть следующий файл конфигурации навигации.Этот конфигурационный файл использует реагирующую навигацию для создания навигаторов.Мой вопрос заключается в том, как я могу вызвать функцию из моего файла конфигурации навигации, который является определением другого компонента, такого как отдельный экран компетентного.В приведенном ниже коде я хочу иметь возможность вызывать showAlert () из кнопки заголовка маршрута карты.Обратите внимание, что showAlert () определяется в компоненте «Карта» под моей конфигурацией навигатора.

const Tabs = createBottomTabNavigator ({
        Map:{screen:MapScreen},
        Profile:{screen:ProfileScreen},
        Consent: { screen: ConsentScreen },
     },
        {



        tabBarOptions: {
             activeTintColor: 'tomato',
             inactiveTintColor: 'gray',
           }
      }


);


Tabs.navigationOptions = ({ navigation }) => {
  const { routes, index } = navigation.state;
  const navigationOptions = {};
if (routes[index].routeName === 'Map') {
   navigationOptions.headerRight= (
                               <Button
                                 onPress={routes.showAlert()}
                                 title="Search"
                                 color="#009688"
                                 backgroundColor="white"
                                 icon={{name:'search',color:'#009688'}}
                               />
                             );

}



 if (routes[index].routeName === 'Profile') {
    navigationOptions.headerRight= (
                            <Button
                              onPress={()=> navigation.navigate('settingaccount')}
                              title="Settings"
                              color="#009688"
                              backgroundColor="white"
                              icon={{name:'settings',color:'#009688'}}
                            />
                          );
     navigationOptions.headerLeft= (
                                 <Button
                                   onPress={()=> navigation.navigate('profileEdit')}
                                   title="Edit Profile"
                                    icon={{name:'account-circle',color:'#009688'}}
                                    color="#009688"
                                    backgroundColor="white"
                                    color="#009688"
                                 />
                               );


 }

 if(routes[index].routeName === 'Consent'||routes[index].routeName === 'Map'){
 navigationOptions.headerLeft= null

 }

  return navigationOptions;
}

// Компонент экрана

class Map extends React.Component {

  showAlert() {
    Alert.alert('No Internet',
      'Check internet connection',
      [
        { text: 'OK', onPress: () => console.log('OK Pressed') },
      ],
      { cancelable: false }
    )
  }



  render() {
    return (
      <View />
    );
  }
}