react-native: undefined is not an object (evaluating 'this.props.navigator.push')

I’m trying to open a second view with a button but I’m receiving: undefined is not an object (evaluating 'this.props.navigator.push') error.

var RegisterNowButton = React.createClass({
  render: function() {
    return (
      <View>
        <TouchableHighlight onPress={this.props.onSelect}>
        <View style={styles.registerNowButtonContainer}>
          <Text style={styles.registerNowButton}>Sign Up Now</Text>
        </View>
        </TouchableHighlight>
      </View>
    );
  }
});

var RegistrationScreen = require('./RegistrationScreen');

var LoginOverlay = React.createClass({

  registerNow: function() {
    this.props.navigator.push({
      title: "hey",
      component: RegistrationScreen,
    });
  },

  render() {
    return (
      <View style={styles.buttonsContainer}>

        < RegisterNowButton
          onSelect={() => registerNow()}
        />
      </View>
    );
  }
});

Crash log:

RCTJSLog> "Error: 
 stack: 
  registerNow                       index.ios.bundle:38452
  <unknown>                         index.ios.bundle:38465
  touchableHandlePress              index.ios.bundle:32219
  _performSideEffectsForTransition  index.ios.bundle:30516
  _receiveSignal                    index.ios.bundle:30440
  touchableHandleResponderRelease   index.ios.bundle:30244
  executeDispatch                   index.ios.bundle:12306
  forEachEventDispatch              index.ios.bundle:12294
  executeDispatchesInOrder          index.ios.bundle:12315
  executeDispatchesAndRelease       index.ios.bundle:11694
  forEachAccumulated                index.ios.bundle:12571
  processEventQueue                 index.ios.bundle:11901
  runEventQueueInBatch              index.ios.bundle:17989
  handleTopLevel                    index.ios.bundle:18015
  _receiveRootNodeIDEvent           index.ios.bundle:17877
  receiveTouches                    index.ios.bundle:17961
  jsCall                            index.ios.bundle:7158
  _callFunction                     index.ios.bundle:7405
  applyWithGuard                    index.ios.bundle:877
  guardReturn                       index.ios.bundle:7207
  callFunctionReturnFlushedQueue    index.ios.bundle:7414
 URL: http://localhost:8081/index.ios.bundle
 line: 38452
 message: undefined is not an object (evaluating 'this.props.navigator.push')"

About this issue

Original URL
State: closed
Created 9 years ago
Comments: 21 (2 by maintainers)

Most upvoted comments

Let’s say you are rendering a LoginOverlay component from some class with an access to navigator prop. You might be able to do this:

<LoginOverlay
      navigator={this.props.navigator}
/>

This should work if my understanding of things is correct. 😕

+29

go1t on Mar 29, 2015

加到父组件吧，然后一层一层传？

maxiaochaos on Dec 22, 2016

我想知道navigator={this.props.navigator}这段代码加到哪里？

Caojunsheng on Dec 21, 2016

I believe you need to use NavigationIOS to be able to access this.props.navigator. Do you have that somewhere else by any chance? since in the code you showed, there isn’t anything of that sort.

go1t on Mar 29, 2015