我有这个问题。我也经历过其他帖子，但无法帮助我。 我附上了我的代码。 我的问题是当我尝试在SearchLead.js中导航时，这给了我相同的错误undefined不是一个对象（评估'this.props.navigator.push'）。 感谢帮助。
index.ios.js
'use strict';
import React, { Component } from 'react';
import {
AppRegistry,
StyleSheet,
Text,
TextInput,
TouchableHighlight,
View,
AsyncStorage,
AlertIOS,
Navigator
}from 'react-native';
var Login = require('./Login');
var AfterLoginView = require('./AfterLoginView');
var Searchlead = require('./Searchlead');
var RenderDetails = require('./RenderDetails');
class EHNYApp extends Component {
componentWillUnmount() {
Actions.currentRouter = null
}
renderScene(route,navigator){
if(route.name == 'login'){
return <Login navigator = {navigator} />
}
if(route.name == 'afterlogin'){
return <AfterLoginView navigator = {navigator} />
}
if(route.name == 'search'){
return <Searchlead navigator = {navigator} />
}
if(route.name == 'renderdetails'){
return <RenderDetails navigator = {navigator} />
}
}
render() {
return (
<Navigator
initialRoute = {{ name: 'login' }}
renderScene = {this.renderScene.bind(this)}
/>
);
}
}
AppRegistry.registerComponent('EHNYApp', () => EHNYApp);
Login.js
'use strict';
import React, { Component } from 'react';
import {
AppRegistry,
StyleSheet,
Text,
TextInput,
TouchableHighlight,
View,
AsyncStorage,
AlertIOS,
NavigatorIOS,
Image,
ActivityIndicatorIOS
} from 'react-native';
var AfterLoginView = require('./AfterLoginView');
var STORAGE_KEY = 'id_token';
class Login extends Component{
constructor(props){
super(props)
this.state = {
username : '',
password : '',
errorMesage : '',
isLoading : false,
}
}
submitForm(event){
this.setState({ isLoading: true });
this.swipeToAfterLoginView('afterlogin');
}
swipeToAfterLoginView(routeName){
this.props.navigator.push({
name : routeName,
});
}
render() {
var spinner = this.state.isLoading ? ( <ActivityIndicatorIOS hidden = 'true' size = 'large'/> ) :
<View/>
return (
<View style = {styles.container}>
<View style = {styles.logo}>
<Image style = {styles.logoImage}
source = {require('./logo.png')}
resizeMode = 'contain'
/>
</View>
{spinner}
<View style = {styles.containerFirst}>
<Text style = {styles.errorMesage}> { this.state.errorMesage } </Text>
<TextInput style = {styles.textInput}
placeholder = 'Email'
placeholderTextColor = 'white'
autofocus = {true}
autoCapitalize = 'none'
onChange = {this.usernameInput.bind(this)} /> </View>
<View style = {styles.containerSecond}>
<TextInput ref = 'password' placeholderTextColor = 'white'
value = { this.state.password}
onChangeText = {password => this.setState({password})}
onSubmitEditing = {this._submitForm}
style = {styles.textInput}
placeholder = 'Password'
autoCapitalize = 'none'
password = {true}
/>
</View>
<TouchableHighlight
style = {styles.button} onPress = {this.submitForm.bind(this)}>
<Text style = {styles.buttonText}> LOGIN </Text>
</TouchableHighlight>
<Text style = {styles.forgotPassword}> Forgot Password ? </Text>
</View>
);
}
}
module.exports = Login;
AfterLoginView.js
'use strict';
import React, { Component } from 'react';
import {
AppRegistry,
StyleSheet,
Text,
TextInput,
TouchableHighlight,
View,
AsyncStorage,
AlertIOS,
Navigator,
TabBarIOS,
ActivityIndicatorIOS
} from 'react-native';
var Dashboard = require('./Dashboard');
var Other = require('./Other');
var Searchlead = require('./Searchlead');
class AfterLoginView extends Component{
constructor(props) {
super(props);
this.state = {
selectedTab:'searchlead',
isLoading : false,
};
}
render(){
var spinner = this.state.isLoading ?
( <ActivityIndicatorIOS
hidden = 'true'
size = 'large'/> ) :
( <View/> );
return (
<TabBarIOS selectedTab = {this.state.selectedTab}>
<TabBarIOS.Item
selected = {this.state.selectedTab === 'searchlead'}
title = 'SearchLead'
systemIcon = 'search'
onPress = { () => {
this.setState({
selectedTab : 'searchlead'
})
}} >
<Searchlead/>
</TabBarIOS.Item>
<TabBarIOS.Item
selected = {this.state.selectedTab === 'dashboard'}
//systemIcon="featured"
title = 'Dashboard'
onPress = {() => {
this.setState({
selectedTab :'dashboard'
});
}}>
<Dashboard/ >
</TabBarIOS.Item>
<TabBarIOS.Item
selected = {this.state.selectedTab === 'other'}
title = 'Other'
onPress = {() => {
this.setState({
selectedTab : 'other'
});
}} >
<Other/>
</TabBarIOS.Item>
</TabBarIOS>
);
}
async submitForm(event){
var demoToken = await AsyncStorage.getItem('id_token');
console.log(demoToken);
// this.login();
}
};
module.exports = AfterLoginView;`
SearchLead.js
'use strict';
import React, { Component } from 'react';
import {
AppRegistry,
StyleSheet,
Text,
TextInput,
ListView,
View,
TouchableHighlight,
Navigator
} from 'react-native';
var RenderDetails = require('./RenderDetails');
var Login = require('./Login');
var ds = new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !== r2});
class Searchlead extends Component {
constructor(props) {
super(props);
this.state = {
searchedAdresses: []
};
};
componentWillMount = function(){
this._pressData = {};
}
_pressData = function (){
console.log("yes");
}
searchedAdresses = (searchedText) => {
if (searchedText === '') {
return [];
}
var url = 'https://maps.googleapis.com/maps/api/place/autocomplete/json?input=' + searchedText + '&types=geocode&key=apikeuys-s&sensor=true';
var i = 0;
var addressData = new Array();
fetch(url, { method:"GET"})
.then((response) = > response.json())
.then((responseData) = > {
for (i = 0; i < responseData.predictions.length; i++){
addressData[i] = {description : responseData.predictions[i].description, place_id : responseData.predictions[i].place_id };
}
this.setState({searchedAdresses: addressData});
})
.done();
};
renderAdress = (rowData, sectionID, rowID) => {
return (
<TouchableHighlight onPress = { this._onPressAddressList.bind(this)} underlayColor = 'white'>
<Text style = { styles.listTextInput }> {rowData.description} </Text>
</TouchableHighlight>
);
};
_onPressAddressList = () => {
this.props.navigator.push({
name:'renderdetails'
});
}
_renderSeperator(sectionID: number, rowID: number, adjacentRowHighlighted: bool) {
return (
<View key = {`${sectionID} - ${rowID}`} style = {{ height: adjacentRowHighlighted ? 4 : 1, backgroundColor: adjacentRowHighlighted ? '#3B5998' : '#CCCCCC', }}
/>
);
}
render() {
return (
<View style = {styles.container}>
<View style = {styles.imageContainer}> </View>
<View style = {styles.textContainer}>
<TextInput
style = {styles.textinput}
onChangeText = {this.searchedAdresses}
placeholder = "Type your adress here"/>
</View>
<View >
<ListView
dataSource = {ds.cloneWithRows(this.state.searchedAdresses)}
renderRow = {this.renderAdress}
renderSeparator = {this._renderSeperator}
enableEmptySections = {true}
/>
</View>
</View>
);
};
}
module.exports = Searchlead;`
注意：忽略我的样式表!! 我经历了以下帖子，但没有帮助我。
https://github.com/facebook/react-native/issues/416
undefined is not an object (evaluating 'this.props.navigator.push')