CODEWITHSUNDEEP
react-native
Adam Katz
Adam Katz

Reputation: 6962

react native TabBarIOS.Item

I am using TabBarIOS.Item which has three options that each lead to a NavigatorIOS, I want to use the TabBar's so that when you click them it takes you to the first page of the NavigatorIOS as apposed to the last one before the user changed tabs, is that possible?

Thanks, Adam

Upvotes: 0

Views: 115

Answers (1)

Adam Katz
Adam Katz

Reputation: 6962

So the answer is, is that TabBARIOS.item is an object and navigatorIOS is also an object, so you can give them both a ref. so they look like this. 

<TabBarIOS.Item 
          title="partners" 
          selected={this.state.selectedTab === "Partners"}
          icon={require("./App/assets/partnersIcon.png")}
          onPress={this.partnersHandleChange.bind(this)} >
          <View style={styles.main}>
            <NavigatePartners ref="partners"></NavigatePartners>
          </View>
        </TabBarIOS.Item>

And the navigator looks like this

turn (
        <NavigatorIOS
      ref="navigator"
      style={styles.mainContainer}
      initialRoute={{
        title: 'Partners',
        component: Partners,
        backButtonTitle: 'Back',
      }}/>

Then you change the onclick to look like this

partnersHandleChange(){
if (this.state.selectedTab == "Partners")
{
  this.refs.partners.refs.navigator.popToTop();
}
this.setState({
  selectedTab: 'Partners',
})

};

Upvotes: 1

Related Questions