Header buttons not showing up when TabNavigator nested inside StackNavigator #946
Description
I have TabNavigator inside StackNavigator and I want to be able to configure left/right buttons in each tab. If I set them in navigationOptions within tab screens it does not show up.
//Tab bar
const TabNavigation = TabNavigator({
Home: {screen: HomeScreen, navigationOptions: {
tabBar: {
icon: ({tintColor}) => <Icon name="home" size={20} color={tintColor} />
}}}
});
//Root router
const PrimaryNav = StackNavigator({
Main: {
screen: TabNavigation,
navigationOptions: {
header: (state, options) => {
return {
...options,
... {
visible: true,
backTitle: null
}
}
}
}
}
}, {
// Default config for all screens
headerMode: 'screen',
initialRouteName: 'Main'
});
//HomeScreen
class HomeScreen extends React.Component {
static navigationOptions = {
title: 'Home',
header: {
left: <Text>Left</Text>,
right: <Text>Right</Text>,
}
};
render() {
return (
<View style={styles.container}>
<Text>Hello</Text>
</View>
)
}
}