React Native TabNavigator, не удается прочитать свойство «навигация» неопределенного

Я только что настроил React Navigation TabNavigator, который отлично работает, но у меня проблемы с переходами между представлениями.

Я получаю следующее сообщение об ошибке при попытке перенаправить пользователя на другую страницу после нажатия кнопки.

Невозможно прочитать свойство «навигация» неопределенного

Я очень смущен тем, как заставить эту работу работать.

Вот навигатор:

import React from 'react';
import { TabNavigator, StackNavigator } from 'react-navigation';
import ElemList from './src/components/ElemList';
import ElemShow from './src/components/ElemShow';

const RootTabs = TabNavigator({
  Home: {
    screen: ElemList,
    navigationOptions: {
      tabBarLabel: 'Home',
      tabBarIcon: ({ tintColor, focused }) => (
        <Ionicons
          name={focused ? 'ios-home' : 'ios-home-outline'}
          size={26}
          style={{ color: tintColor }}
        />
      ),
    },
    main: {
      screen: StackNavigator({
        show: { screen: ElemShow },
      })
    }
  }
});

Вот мой код:

onRowPress(data) {
this.props.navigation.navigate('ElemShow', {id: data})
};

render() {

const { key, elem } = this.props;

 return (
  <TouchableWithoutFeedback onPress={() => this.onRowPress(elem)}>
    <View style={styles.viewStyle} key={key}>
      <Text>Here is the info</Text>
    </View>
  </TouchableWithoutFeedback>
 )

}