@H_301_1@源码如下:
“React Native,undefined is not an object (evaluating ‘this.props.navigator.push’)”
原文链接:https://www.f2er.com/react/307163.html'use strict';
import React,{
AppRegistry,Component,StyleSheet,Text,View,ScrollView,PixelRatio,NavigatorIOS,TextInput,} from 'react-native';
class HelloWorld extends Component {
render() {
return (
<NavigatorIOS style = {styles.flex} initialRoute = {
{
component: NavigatorRouteView,title: 'Hi',passProps: {},}
} />
);
}
}
class NavigatorRouteView extends Component {
jumpTo() {
// alert(this.props.navigator);**(1)**
// alert(this);
this.props.navigator.push({
component: NavigatorDetailView,title: 'Detail Info',rightButtonTitle: 'Shopping',});
}
render() {
return (
<ScrollView style = {styles.flex}>
<View style = {styles.item}>
<Text style = {styles.list_font} onPress = {this.jumpTo}/*3*/>HelloWorld</Text>
</View>
</ScrollView>
);
}
}
class NavigatorDetailView extends Component {
render() {
return (
<View style = {{flex: 1,backgroundColor: 'red'}}></View>
);
}
}
const styles = StyleSheet.create({
list_font: {
fontSize: 16,},item: {
flex: 1,// borderWidth: 1,
// borderColor: 'blue',
height: 80,flex: {
flex: 1,font: {
fontSize: 20,color: '#fff',fontWeight: 'bold',});
AppRegistry.registerComponent('HelloWorld',() => HelloWorld);
@H_301_1@点击界面跳转到下一级界面无反应,放开注释一处的代码:
alert(this.props.navigator);
@H_301_1@则给出undefined的错误信息,而打印this.props同样给出undefined错误信息,经查询,错误处在点击方法绑定上:
onPress = {this.jumpTo}
@H_301_1@修改为:
onPress = {this.jumpTo.bind(this)}
@H_301_1@即可,参考: “React Native,undefined is not an object (evaluating ‘this.props.navigator.push’)”