Question

React Native - 将一个屏幕推送到另一个屏幕有问题

2017-07-29

166

react-native react-router react-navigation react-native-0.46

我使用了 ' StackNavigator '，在按钮事件中写入导航代码时，我遇到了推送问题。但如果我们直接编写 onPress 事件，它就可以正常工作，

导入文件。

import { StackNavigator } from "react-navigation";
import SignUpScreen from "./SignUp";

推送另一个正在工作：

render() {
    console.disableYellowBox = true;
    const { navigate } = this.props.navigation;
    return (
       <View style={styles.viewStyle}>
         <TouchableHighlight style = {styles.buttonStart}
             onPress={() => navigate("SignUpCompany")}>
               <Image
                 source={require('./Images/hire.png')}
               />
         </TouchableHighlight>
       </View>
    );
  }

通过函数推送另一个不起作用：

pushcode() {
     console.log('call');
     this.props.navigation.navigate('SignUp');
   }

   render() {
    return (

     <TouchableHighlight style = {styles.buttonStart}
         onPress={this.pushcode}>
           <Image
             source={require('./Images/hire.png')}
           />
     </TouchableHighlight>

    );}

单击按钮时出错：

谢谢。请帮帮我。

Answer 1

看起来你在这行中使用了 push extra

this.props.navigation.navigate.push('SignUp');

试试这个会对你有用

this.props.navigation.navigate('SignUp');

也许这可以帮助你

Answer 2

我认为您错过了构造函数中的函数 bind --- 这就是为什么您得到 undefined is not an object (evaluating 'this.props.navigation') 。因为 this 在 pushcode 函数范围内未定义。

将以下内容添加到您的构造函数中：

constructor(props) {
    super(props);

    this.pushcode = this.pushcode.bind(this);
    ...
}