如何在導航器中使用tabbar反應本機

Question

我現在在這個問題上有麻煩。

因爲有一些屏幕不使用tabbar，而且我需要在導航欄中使用矢量圖標，而不是使用react-native-tabbar-navigator，所以我嘗試在Navigator中使用tabbar，如下所示。

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 } /> 
      ); 
      }    
      } 
     } 
     /> 
); 
} 

但是當我點擊TabBarItemIOS按鈕，onPress事件根本不會被調用，如果我點擊LearningList頁面編輯按鈕時，onPress回調調用所有TabBarItemIOS按鈕。

這裏是LearningList.js的下一個按鈕內容。

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

所以，我希望知道在Navigator中使用tabbar的正確方法。

請幫幫我!!!

Answer 1

這是因爲您正在調用該函數而不是傳遞函數引用。要做你想做的事，你只需要箭頭功能。例如更換：

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

到

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