Home.js

import React from 'react';
import {Alert, Image, View, Button} from 'react-native';

export default class HomeScreen extends React.Component {
  static navigationOptions = {
    title: 'Home',
  };
  onPress() {
	console.log('onPress called');
  }
  onMessage() {
	  console.log('onMessage called.');
		Alert.alert(
		  'Alert Title',
		  'My Alert Msg',
		  [
			{text: 'Ask me later'},
			{
			  text: 'Cancel',
			  style: 'cancel',
			},
			{text: 'OK'},
		  ],
		  {cancelable: false},
		);
	  console.log('onMessage called and complete.');
  }
  render() {
    const {navigate} = this.props.navigation;
    return (
		<View>
		  <Button
			title="Click Me!"
			onPress={this.onMessage}
		  />
		  <Button
			title="Go to Jane's profile"
			onPress={() => navigate('Profile', {name: 'Jane'})}
		  />
		  <Button
			title="Go to Tablet Web View"
			onPress={() => navigate('TabletWebView', {})}
		  />
		  <View style={{
				justifyContent: 'center',
				alignItems: 'center'
		}}>
			  <Image style={{
					height: '192px',
					width: '192px'
				}}
			  source={require('../assets/icon.png')}
			  />
		  </View>
	  </View>
    );
  }
}

onMessage = () => {
console.log("onMessage");
}

sometime I find that I need to do:

onMessage = () => () => {
console.log("onMessage");
}

depending on how function is called or if you are passing params