您的位置:首页 > 移动开发 > Objective-C

【ReactNative】undefined is not an object(evaluating 'this.props.navigator')

2016-06-15 17:28 609 查看
使用ReactNative 用NavigatorIOS做跳转时,遇到报错:

undefined is not an object(evaluating 'this.props.navigator')

代码如下:
/**
* 003.网易新闻
*/

import React, { Component } from 'react';

import {
AppRegistry,
StyleSheet,
View,
NavigatorIOS,
ScrollView,
Text,
} from 'react-native';

// 游轮列表
class List extends React.Component {
render() {
return (
<ScrollView style={styles.flex}>
<Text style={styles.list_item} onPress={this.goTo.bind(this)}>✨ 豪华游轮济州岛</Text>
<Text style={styles.list_item} onPress={this.goTo.bind(this)}>✨ 豪华游轮太平岛</Text>
<Text style={styles.list_item} onPress={this.goTo.bind(this)}>✨ 豪华游轮钓鱼岛</Text>
</ScrollView>
);
}

goTo() {
this.props.navigator.push({
component: Detail,
title: '游轮详情',
rightButtonTitle: '购物车',
onRightButtonPress: function() {
alert('进入购物车!');
}
});
}
}

// 游轮详细信息
class Detail extends React.Component {
render() {
return (
<ScrollView>
<Text style={styles.detail_text}>详情页面</Text>
<Text style={styles.detail_text}>详情信息介绍</Text>
</ScrollView>
);
}
}

class App extends React.Component {
render() {
return (
<NavigatorIOS
style={styles.flex}
initialRoute={{
component: List,
title: '游轮',
passProps: {},
}}
>

</NavigatorIOS>
);
}
}

const styles = StyleSheet.create({
flex: {
flex: 1,
},
list_item: {
fontSize: 16,
color: 'red',
},
detail_text: {
fontSize: 18,
color: 'blue',
}
});

AppRegistry.registerComponent('AwesomeProject', () => App);


解决办法:把

onPress={this.goTo}换成
onPress={this.goTo.bind(this)}即可

参考链接:http://stackoverflow.com/questions/30079640/undefined-is-not-an-object-evaluating-this-props-navigator-push
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息