![](/img/trans.png)
[英]React Native: React Navigation StackNavigator not working. Getting error: “undefined is not an object (evaluating 'this.props.navigation.navigate')”
[英]React Native Navigation(StackNavigator): I get an error saying “ undefined is not an object (evaluating 'this.props.navigate') ”
我才刚刚开始学习本机操作。...现在正在做一个宠物项目。...在应用程序中,单击它时有一个按钮导航到另一个屏幕。 我收到以下错误消息:“ undefined不是对象(正在评估'this.props.navigate')”以下是文件
index.js
import React from "react";
import Navigator from "./config/routes";
export default () => <Navigator />;
我的config / routes.js中的代码
import { StackNavigator } from "react-navigation";
import Home from "../screens/Home";
import List from "../screens/List";
export default StackNavigator({
Home: {
screen: Home,
navigationOptions: {
header: () => null
}
},
List: {
screen: List
}
});
和我的组件文件Home.js,该文件具有单击后单击导航到另一个屏幕的按钮
/*all import statements*/
class Home extends Component {
handlePressBaseCurrency() {
console.log("base currency button clicked");
this.props.navigation.navigate("List"); /* error from this line */
}
render() {
return (
<UserInput
currencyShort={TEMP_BASE_CURRENCY}
onPress={this.handlePressBaseCurrency}
defaultValue={TEMP_BASE_PRICE}
keyboardType="numeric"
onChangeText={this.handleTextChange}
/>
);
}
}
请帮忙!!! 提前致谢
this
在handlePressBaseCurrency
未正确handlePressBaseCurrency
。 您可以:
在您的构造函数中明确绑定 this
:
constructor(props) { super(props); this.handlePressBaseCurrency = this.handlePressBaseCurrency.bind(this); }
从React Docs 处理事件 :
如果使绑定烦恼,可以通过两种方法解决此问题。 如果使用实验性的公共类字段语法 ,则可以使用类字段正确绑定回调:
handlePressBaseCurrency = () => { console.log("base currency button clicked"); this.props.navigation.navigate("List"); };
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.