React Native Fehler: undefined ist kein Objekt (Bewertung '_this2.props.navigator.push')

Question

Also Grundsätzlich bekomme ich Fehler im Titel, der mit dem Navigator verwandt ist. Der Fehler erscheint, wenn ich auf das Symbol drücke.

Was ich will, sind im Grunde tun, um eine Tab-Leiste an der Spitze zu machen, die zwischen drei verschiedenen Ansichten wechseln: feed, Wiki, und message board

Hier sind mein index.android.js: (Importe Nav)

_renderScene(route, navigator) { 
    var globalNavigatorProps = {navigator}; 

    switch(route.ident) { 
     case "FeedView": 
      return(
       <Feed 
       {...globalNavigatorProps} 
       /> 
      ); 

     case "WikiView": 
      return(
       <View> 
        <Text> 
         {'Hello'}; 
        </Text> 
       </View> 
      ); 

     case "BoardView": 
      return(
       <View> 
        <Text> 
         {'Hello'}; 
        </Text> 
       </View> 
      ); 

     default: 
      console.log(`Something went wrong ${route}`); 
    } 
} 

render(){ 
    return(
     <View> 
      <Nav /> 
      <Navigator 
       initialRoute={{ident:"Feed"}} 
       ref="appNavigator" 
       renderScene={ this._renderScene } 
      /> 

     </View> 
    ); 
} 

Hier ist meine Nav.js:

constructor(props){ 
    super(props); 
} 

render(){ 

    console.log(this.props.navigator); 
    return(
     <View style={{flexDirection: "column"}}> 
      <View style={styles.nav}> 
       <Icon onPress={(event) => this.props.navigator.push({ident: "Feed"})} name="newspaper-o" size={22}/> 
       <Icon name="wikipedia-w" size={22}/> 
       <Icon name="comments" size={22}/> 
      </View> 
      <View style={styles.divider}/> 
     </View> 
    ); 
} 

_changeView(type){ 

} 

Answer 1

Symbol, wenn Sie eine mit Registerkarten Ansicht zu implementieren versuchen, bessere Wege zu tun Es kann immer ein Open-Source-Modul wie dieses verwendet werden https://github.com/skv-headless/react-native-scrollable-tab-view der Entwickler hat es so gemacht, dass es einfach zu bedienen ist und das Beispiel ist gut genug, um durch das meiste Teil zu bekommen.

Also anstatt solche Komponenten selbst zu erstellen, würde ich vorschlagen, die Module von der Gemeinschaft zu verwenden.

Hope meine Antwort war hilfreich.

Answer 2

ich glaube nicht, dass dies das Problem ist, aber die renderScene Funktion wird nicht auf die reagieren Komponente gebunden sein.

Versuchen renderScene={ this._renderScene } in renderScene={ this._renderScene.bind(this) }

Answer 3

dieser Fehler tritt immer dann auf, wenn Sie nur knapp sein Ziel binden (this) drehen, überprüfen Sie Modul onPress Methode