Akash Chowdary Akash Chowdary - 6 days ago 8
React JSX Question

evaluating ( this.props.navigator ) Undefined is not an object

I'm getting this error even though i'm passing in the navigator porp properly.

MySetup is in this way : Main navigator Page -> FirstView (onBtnPress) -> Details

I'm getting the error when i'm calling this.navigator.push in the firstView page.

Main File:

import React, { Component, PropTypes } from 'react';

import {
AppRegistry,
StyleSheet,
Text,
View,
Navigator
} from 'react-native';

class app extends Component{

constructor(props) {
super(props);
}


navigatorRenderScene(route, navigator) {
return <route.component navigator={navigator}/>

}
configureScene() {
return Navigator.SceneConfigs.VerticalDownSwipeJump;
}


render() {

return (
<Navigator
style={styles.container}
initialRoute= {{component: MainMapView}}
renderScene={this.navigatorRenderScene}/>
);
}
}


const styles = StyleSheet.create({
container: { flex: 1, flexDirection: 'column', padding: 20 }
});

AppRegistry.registerComponent('app', () => app);


First Component:

<ActionButton buttonColor="rgba(30,144,255,1)" style={styles.fabIcon}
onPress={this.fabPress}>
</ActionButton>


fabPress() {
this.props.navigator.push({
component : DetaislView
});
}


The error occurs on fabPress.

Any ideas on what i'm doing wrong?

Answer

try this in your FirstComponent.js:

class FirstComponent extends Component {

    constructor(props) {
        super(props); 
        this.fabPress = this.fabPress.bind(this);
    }

    // ... rest of the code remains the same
Comments