2016-10-20 3 views
0

당신이 나를 도울 수 있기를 바랍니다.내 응용 프로그램에서 탐색 변수를 찾을 수 없습니다. - "ReferenceError : 변수를 찾을 수 없습니다 : 탐색기"

저는 다음과 같은 자습서에서 간단한 응용 프로그램을 개발하기 위해 react-native와 협력하고 있습니다. 문제는 그것이 "네비게이터"를 가지고 있으며 작동하게 만들 수 없다는 것입니다. 내 코드를 공유 할 수 있습니다 :

index.android.js

import React, { Component } from 'react'; 
import { AppRegistry, StyleSheet, Text, View, Navigator } from 'react-native'; 
import SearchPage from './SearchPage'; 

    class PropertyFinder extends React.Component { 
     render() { 
     return (
      <Navigator 
      initialRoute={{ title: 'Pagina Busqueda', index: 0 }} 
      renderScene={(route, navigator) => { 
       return <SearchPage title={route.title} /> 
      }} 
      /> 
     ); 
     } 
    } 

    AppRegistry.registerComponent('Project',() => PropertyFinder); 

을 그리고 이것은 다른 파일입니다 SearchPage.js

import React, { Component } from 'react' 
    import { StyleSheet, Text, TextInput, View, TouchableHighlight, ActivityIndicator, Image, Navigator } from 'react-native'; 
    import SearchResults from './SearchResults'; 

export default class SearchPage extends Component { 
    constructor(props) { 
    super(props); 
    this.state = { 
     searchString: 'london', 
     message: '' 
    }; 
    } 
    onSearchTextChanged(event) { 
    this.setState({ searchString: event.nativeEvent.text }); 
    } 
    _executeQuery(query) { 
    console.log(query); 
    fetch(query) 
    .then(response => response.json()) 
    .then(json => this._handleResponse(json.response)) 
    .catch(error => 
    this.setState({ 
     message: 'Something bad happened ' + error 
    })); 
    } 

    onSearchPressed() { 
    var query = urlForQueryAndPage('place_name', this.state.searchString, 1); 
    this._executeQuery(query); 
    } 
    _handleResponse(response) { 
    this.setState({ message: '' }); 
    if (response.application_response_code.substr(0, 1) === '1') { 
     const nextIndex = route.index + 1; 
     navigator.push({ 
     title: 'Results ' + nextIndex, 
     index: nextIndex, 
     component: SearchResults, 
     passProps: {listings: response.listings} 
     }); 
    } else { 
     this.setState({ message: 'Location not recognized; please try again.'}); 
    } 
    } 
    render() { 
    return (
     <View style={styles.container}> 
     <Text style={styles.description}> 
      Buscar casas para compra !!! 
     </Text> 
     <Text style={styles.description}> 
      Busca por área, CP, o cerca de tu ubicación. 
     </Text> 
     <View style={styles.flowRight}> 
      <TextInput 
      style={styles.searchInput} 
      value={this.state.searchString} 
      onChange={this.onSearchTextChanged.bind(this)} 
      placeholder='Búsqueda por nombre o CP'/> 
      <TouchableHighlight style={styles.button} 
       underlayColor='#99d9f4' onPress={this.onSearchPressed.bind(this)}> 
      <Text style={styles.buttonText}>Go</Text> 
      </TouchableHighlight> 
     </View> 
     <TouchableHighlight style={styles.button} 
      underlayColor='#99d9f4'> 
      <Text style={styles.buttonText}>Location</Text> 
     </TouchableHighlight> 
     <Image source={require('./Resources/house.png')} style={styles.image}/> 
     <Text style={styles.description}>{this.state.message}</Text> 
     </View> 
    ); 
    } 
} 
function urlForQueryAndPage(key, value, pageNumber) { 
    return 'http://api.nestoria.co.uk/api?country=uk&pretty=1&encoding=json&listing_type=buy&action=search_listings&page=1&place_name=london'; 
}; 

그리고 의 SearchResult라는 다른 파일이 .js하지만 문제가 발생하기 때문에 공유 할 필요가 없다고 생각합니다. SearchPage.js.

const nextIndex = route.index + 1; 
     navigator.push({ 
     title: 'Results ' + nextIndex, 
     index: nextIndex, 
     component: SearchResults, 
     passProps: {listings: response.listings} 
     }); 

내가 오류를 받고 있어요 :

내 애플합니다 (_handleResponse 방법에) 지시를 실행하려고

오류 ReferenceError : 변수를 찾을 수 없습니다 : 어느 네비게이터 경로 ( 내가 경로 물건을 제거하면

누구든지 나를 도와 줄 수 있습니까?

감사합니다.

답변

1

당신은 그렇지 않으면 this.props

this.props.navigator.push({ 
     title: 'Results ' + nextIndex, 
     index: nextIndex, 
     component: SearchResults, 
     passProps: {listings: response.listings} 
     }); 

를 사용하여 searchPage에서 네비게이터에 도달 할 수 및 searchPage의 생성자에서 _handleResponse을 결합하는 것을 잊지 마세요 다음

<SearchPage title={route.title} navigator={navigator}/> 

을 SearchPage하는 네비게이터를 통과해야 정의되지 않음

this._handleResponse=this._handleResponse.bind(this) 
+0

우우 맨 ... 당신은 마스터입니다. g 네비게이터 변수. 고맙습니다!!! – darthVader

관련 문제