反応するネイティブナビゲータの問題

Question

申し訳ありませんが、このエラーの要素の種類が無効です：文字列（組み込みコンポーネント用）またはクラス/関数（複合コンポーネント用）が必要ですが、未定義です。 'Navigator'。

here's the code; 


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

import ButtonPage from './jara/initialpage'; 
import NotePage from'./jara/Notescreen'; 
import HomeScreen from './jara/HomePage'; 

var NavigationBarRouteMapper = { 
    LeftButton(route, navigator, index, navState) { 
    if(index > 0) { 
     return (
     <TouchableHighlight 
      underlayColor="transparent" 
      onPress={() => { if (index > 0) { navigator.pop() } }}> 
      <Text style={ styles.leftNavButtonText }>Back</Text> 
     </TouchableHighlight>   
     ); 
    } 
    else { return null } 
    }, 
    RightButton(route, navigator, index, navState) { 
    if (index <= 0) return (
     <ButtonPage 
     onPress ={() => { 
     navigator.push({ 
     }); 
     }} 
     customText = 'create Note' 
     /> 
     ); 
    }, 
    Title(route, navigator, index, navState) { 
    return (
     <Text style={ styles.title }>Home Page</Text> 
     ); 
    } 
}; 


class NavProject extends Component{ 
    renderScene(route,navigator){ 
     return(
      <route.component navigator = {navigator}/> 
      ); 
      } 
render(){ 
    return(
     <View style = {styles.MainContainer}> 
      <View style = {styles.container}> 
       <ButtonPage/> 
      </View> 

     <Navigator 
      initialRoute ={{page: 'Home'}} 
      renderScene ={this.renderScene.bind(this)} 
      navigationBar ={ 
       <Navigator.NavigationBar 
       routeMapper = {NavigationBarRouteMapper} 
      /> 
      } 
      configScene ={(route,navigator) => 
      Navigator.sceneConfigs.floatFromRight} 
     /> 
     </View>  
    ); 
    } 
} 

class ReactNote extends Component{ 
    renderScene(route,navigator){ 

       if(index <= 0){ 
       return(
        <View style = {styles.container}> 
         <HomeScreen 
         onPress={() =>{ 
         navigator.push({}); 
       }} 
      /> 
        </View>      
        ); 
       } 
     else if(index > 0){ 
      return(
      <View styles ={styles.scontainer}> 
       <NotePage 
       onPress={() =>{ 
       navigator.pop(); 
       }} 
      /> 
        /> 
      </View>  
      ); 
     } 

    } 
} 



const styles = StyleSheet.create({ 
    container:{ 
       flex:1, 
       justifyContent:'center', 
       alignItems:'center', 
    }, 
     container:{ 
     backgroundColor:'blue', 
     flex:1, 
    }, 
    scontainer:{ 
     backgroundColor:'lightblue', 
     flex:1, 
    } 

}); 


AppRegistry.registerComponent('NavProject',()=> NavProject); 

Answer 1

私は後でrenderSceneがnavigator.push」私が意味することにより、同様のナビゲーションcontrols.andを持つことabove.Hadを示すように参照された個々のコンポーネントページの、NavigationRouteMapper、と同様に動作することがわかりました（{}）; 'と 'navigator.pop（）;'それぞれのページにme.plusのために働いた私はrenderScene.bind（これ）を取り除き、ちょうどrenderSceneの小道具の下にコードを書きました。