No prop error in component

This should be simple, but I’m trying to simply have a way when people are offline to go to a specific screen - this is in app.js (I left out the code to determine when the user is offline). When they are offline the component NotOnline shows, but if you touch on Categories! you get "undefined is not an object (evaluating o.props.navigation, navigate). Is there something I’m obviously missing? Thanks.

 import React from "react";
       import {
      } from "react-native";
       import { AppLoading, Asset } from "expo";

import RootNavigation from "./navigation/RootNavigation";

class NotOnline extends React.Component {

_handlePress = () => {
 render() {
  return (  
      <View >
        <Text onPress={this._handlePress}>Categories!</Text>

export default class AppContainer extends React.Component {
      state = {
         appIsReady: false,
         isOnline: false,

render() {
   if (!this.state.isOnline) {
     return <NotOnline />;

  if (this.state.appIsReady && this.state.loggedIn) {
    return (
      <View style={styles.container}>
        {Platform.OS === "ios" && <StatusBar barStyle="default" />}
        {Platform.OS === "android" && (
          <View style={styles.statusBarUnderlay} />
        <RootNavigation />
  } else {
    return <AppLoading />;


Your issue may be answered by this comment on a similar GH issue. Paraphrasing: you need to give access to navigation either by having your component be a screen of your navigator or by passing navigation down as props (from a screen component).

React Navigation’s docs are actually really clear and concise, if you haven’t already read through them.

Best of luck!

Thanks…this helps a lot.

1 Like

This topic was automatically closed 15 days after the last reply. New replies are no longer allowed.