evaluate(this.props.navigator)Undefined不是对象

Question

即使我正确地通过导航器porp,我也会收到此错误.

MySetup就是这样的:主导航器页面 - > FirstView(onBtnPress) - >详细信息

当我在firstView页面中调用this.navigator.push时,我收到错误.

主文件:

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);

第一部分:

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


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

fabPress发生错误.

关于我做错什么的任何想法？

Answer 1

在FirstComponent.js中尝试这个:

class FirstComponent extends Component {

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

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

为什么我们不得不这样做？

回到我们使用时React.createClass(ES5),类方法自动绑定到类.但是当我们开始extend(ES6类)时,我们需要将方法显式绑定到类env.

fabPress作为事件的回调函数传递,它在类外的另一个env中执行; 因此,this将来自执行范围env.但我们需要this我们的班级访问this.props.navigator:)