Wie verwende ich die Tab-Leiste im Navigator im reaktions-nativen

Question

Ich habe jetzt Probleme mit diesem Problem.

Da es einige Bildschirme gibt, die keine Tabbar verwenden und auch ich Vektor-Symbol in der Navigationsleiste verwenden muss, anstatt reactive-native-Tabbar-Navigator zu verwenden, habe ich versucht, im Navigator die Tableiste zu verwenden.

render() { 
    return (
     <Navigator 
     initialRoute={{name: 'LearningList', index: 0}} 
     renderScene={(route, navigator) => 
      { 
      if (route.name == 'LearningList') { 
       return (
       <LearningList navigator={navigator} /> 
      ); 
      } 
      if (route.name == 'MyLearning') { 
       return (
       <View style={{ flex: 1, }}> 
        <MyLearning navigator={navigator} /> 
        <TabBarIOS 
        tintColor="black" 
        barTintColor="#3abeff"> 
        <Ionicon.TabBarItemIOS 
         style={ styles.tabBarItem } 
         selected={false} 
         iconName='ios-search' 
         title='Explorer' 
         navigator={navigator} 
         onPress={ this.changeTabSelection('LearningList') }> 
         <View></View> 
        </Ionicon.TabBarItemIOS> 
        <Ionicon.TabBarItemIOS 
         style={{ backgroundColor: 'green' }} 
         selected={true} 
         iconName='ios-list-outline' 
         title='My Learning' 
         navigator={navigator} 
         onPress = { this.changeTabSelection('MyLearning') }> 
         <View></View> 
        </Ionicon.TabBarItemIOS> 
        </TabBarIOS> 
       </View> 
      ); 
      } 
      if (route.name == 'Schedule') { 
       return (
       <Schedule navigator={navigator} learningID={ route.learningID } /> 
      ); 
      }    
      } 
     } 
     /> 
); 
} 

Aber wenn ich TabBarItemIOS Schaltflächen klicken, wird onPress Ereignis überhaupt nicht aufgerufen, und wenn ich Schaltfläche Bearbeiten in LearningList Seite klicken, werden die onPress Rückrufe werden für alle TabBarItemIOS Tasten aufgerufen.

Hier ist LearningList.js nächste Schaltfläche Inhalt.

const rightButtonConfig = { 
    title: 'Next >', 
    handler:() => { 
    this.props.navigator.push({ 
    name: 'MyLearning' 
    }); 
    } 
    }; 

Also, ich hoffe, den richtigen Weg der Verwendung von Tabbar im Navigator kennen.

Bitte helfen Sie mir !!!

Answer 1

Dies liegt daran, dass Sie diese Funktion aufrufen, anstatt eine Funktionsreferenz zu übergeben. Um zu tun, was Sie wollen, brauchen Sie nur Pfeilfunktionen. Zum Beispiel ersetzen:

onPress={ this.changeTabSelection('LearningList') }> 

zu

onPress={() => this.changeTabSelection('LearningList') }>