在 React Native 中导航 iOS

Question

我看过很多关于如何在 React Native 中导航屏幕的 Stack Overflow 帖子，但似乎都没有效果，可能是因为这些帖子是针对旧版本的 React Native 的。这是我的代码，下面删除了不相关的部分。我正在尝试从这个屏幕导航到另一个名为 SubTasks 的屏幕。顺便说一句，我确保说导出默认类 SubTasks 扩展了 SubTasks.js 中的 React.Component。单击按钮时出现的错误是“未定义不是对象（评估 this.props.navigator.push'）。有谁知道我的错误可能在哪里？

    import React, { Component, PropTypes } from 'react';
    import { StyleSheet,NavigatorIOS, Text, TextInput, View, Button} 
             from 'react-native';
    import SubTasks from './SubTasks';

    export default class App extends React.Component {
      constructor(props) {
        super(props);
      }                                                        
      renderScene(route, navigator) {
         if(route.name == 'SubTasks') {
           return <SubTasks navigator = {navigator} />
         }
      }

      _navigate() {
        this.props.navigator.push({
          title: 'SubTasks',
        })
      }

      render() {
        return (
          <View>
            <NavigatorIOS
              initialRoute= {{ 
                title: 'SubTasks',
                component: SubTasks,
              }} 
              style = {{ flex: 1 }}                                          
            />                                 
            <Button 
              title= 'SubTasks'
              style = {{flexDirection: 'row', fontSize: 20, alignItems: 'flex-end'}}
              color = 'blue'
              onPress= {() => this._navigate()}>
              styleDisabled = {{color: 'red'}}
            </Button>
          </View>                                                              
      )}                                                                       
   }

Answer 1

确保在构造函数中绑定 _navigate 函数：

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

或者考虑使用箭头函数

_navigate = () => {
  this.props.navigator.push({
    title: 'SubTasks',
  })
}