javascript - undefined 不是对象(评估 '_this.props.navigator.push' )

Question

我正在尝试从主屏幕导航到另一个屏幕(测试)。下面有“HomeScreen.js”。单击注册按钮后，出现上述错误。

我已经处理了整整一天，但似乎无法得到直接的答案。

错误出在我的“Homescreen.js”上(附上屏幕截图错误) Screenshot

错误指向:_handleRegisterView 函数下的 this.props.navigator.push。

HomeScreen.js

import React from 'react';
import {
  StyleSheet,
  Text,
  View,
  AsyncStorage,
  Component,
  TouchableHighlight,
  AppRegistry
} from 'react-native';

import Test from './Test';

import { StackNavigator } from 'react-navigation';

class HomeScreen extends React.Component {
  static navigationOptions = {
    title: 'SpeedHack',
  };

  _handleRegisterView = () => {

    this.props.navigator.push({
      title: 'Test',
      component: Test,
      backButtonTitle: 'Back'
    })
    //alert('Register button Pressed!.');
  }

render() {
    return (

      <View style={styles.container}>
        <TouchableHighlight onPress={this._handleRegisterView}>
          <Text style={[styles.button, styles.blueButton]}>
            Register
          </Text></View>
    );
  }
}

Test.js(没有真正做任何有趣的事情，加载图像)

import React from 'react';
import { Component, StyleSheet, Text, View, Image } from 'react-native';

class Test extends React.Component {
  render() {
    let pic = {
      uri: 'https://upload.wikimedia.org/wikipedia/commons/d/de/Bananavarieties.jpg'
    };
    return (
      <View style={styles.container}>
        <Text>Ssup Dude! Want some bananas?</Text>
        <Image source = {pic} style = {{width: 300, height: 300}}/>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
});

Answer 1

你似乎很困惑。在 react-navigation 中，为了推送屏幕，您不执行 this.props.navigator.push，而是使用 this.props.navigation.navigate.