Call a Function in createbottomtabsnavigator - react-native

Question

I am using react native and i want to call a function in tabs
import {createBottomTabNavigator} from 'react-navigation-tabs';
const TabNavigator = createBottomTabNavigator(
{
Home:{
screen:CustomMapView,
navigationOptions:{
tabBarLabel:'Home',
tabBarIcon:({tintColor})=>(
<Image source = {require("../../Images/react-logo.png")} style={{width : 30 , height:30}}/>
)
}
}, Profile11:{
screen:Profile11,
navigationOptions:{
tabBarLabel:'Profile11',
tabBarIcon:({tintColor})=>(
<Image source = {require("../../Images/react-logo.png")} style={{width : 30 , height:30}}/>
)
}
},
Profile: {
screen:ProfileScreen,
navigationOptions:{
tabBarLabel:'Profile',
tabBarIcon:({tintColor})=>(
// <Icon name="ios-person" color={tintColor} size={25}/>
<Image source = {require("../../Images/react-logo.png")} style={{width : 30 , height:30}}/>
)
}
},
},
{
initialRouteName: "Home"
},
);
As i am using above i want to set some contions on tabs like home if condition true run set CustomMapView as the screen if condition false any other screen will set like CustomMapView.js
how can i do this

Answer 1

Check this example if you want to set a condition for rendering page:
const MainApp = createBottomTabNavigator(
{
Home: HomeTab ,
Settings: SettingsTab ,
},
{
defaultNavigationOptions: ({ navigation }) => ({
tabBarIcon: ({ focused, horizontal, tintColor }) => {
const { routeName } = navigation.state;
if (routeName === 'Home') {
return (
<Image
source={ require('./assets/home.png') }
style={{ width: 20, height: 20, }} />
);
} else {
return (
<Image
source={ require('./assets/settings.png') }
style={{ width: 20, height: 20 }} />
);
}
},
}),
tabBarOptions: {
activeTintColor: '#FF6F00',
inactiveTintColor: '#263238',
},
});
And if you want to call a method on tab press, then refer this example :
Profile: {
screen:ProfileScreen,
navigationOptions:{
tabBarLabel:'Profile',
tabBarIcon:({tintColor})=>(
// <Icon name="ios-person" color={tintColor} size={25}/>
<Image source = {require("../../Images/react-logo.png")} style={{width : 30 , height:30}}/>
),
tabBarOnPress: () => { this.openGallery() }
}
},