在tabnavigator中反应导航标题按钮功能调用

Question

我有以下导航配置文件。此配置文件使用react导航创建导航器。我的问题是我怎么能从 我定义的导航配置文件是另一个组件，例如单独的 屏幕主管。在下面的代码中，我希望能够调用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 />
    );
  }
}