I have set up navigation with Bottom tabs in react-native-navigation, this is working fine
bottomTabs: {
id: 'BOTTOM_TABS_LAYOUT',
children: [
{
stack: {
id: 'HOME_TAB',
children: [
{
component: {
id: 'HOME_SCREEN'
name: 'HomeScreen'
}
}
],
options: {
bottomTab: {
icon: require('./home.png')
}
}
}
},
{
stack: {
id: 'PROFILE_TAB',
children: [
{
component: {
id: 'PROFILE_SCREEN',
name: 'ProfileScreen'
}
}
],
options: {
bottomTab: {
icon: require('./profile.png')
}
}
}
}
]
}
But I want to add some other code when I switch from a tab to another, how could this be done?
You can listen to tab selection events by registering a Navigation events listener. The tabSelected
event is emitted when the selected tab has changed.
Navigation.events().registerBottomTabSelectedListener((selectedTabIndex, unselectedTabIndex) => {
});
If you'd like to handle the tab selection yourself, set the selectTabOnPress: false
option on the bottomTab
you'd like to handle selection for, and register a tabPressed
listener to handle the tab press event. This event is emitted when a tab is pressed by the user.
options: {
bottomTab: {
icon: require('./home.png'),
selectTabOnPress: false
}
}
Navigation.events().registerBottomPressedListener((tabIndex) => {
});