这是我的app结构 . 我已经使用react-navigation实现 drawer, Tab and Stack Navigation . 如何处理 Headers ?

Root Stack:

const PrimaryNav = StackNavigator({
   drawerStack: { screen: DrawerNavigation }
}

DrawerNavigation:

const DrawerStack = DrawerNavigator({
  'screen 1': {screen: Screen1TabNav},
  'screen 2': {screen: Screen2TabNav},
},{
  gesturesEnabled: false,
  contentComponent: DrawerContainer
})

const DrawerNavigation = StackNavigator({
  DrawerStack: { screen: DrawerStack }
  },{
    headerMode: 'float',
    navigationOptions: ({navigation}) => ({
    headerStyle: {backgroundColor: colors.border_color, height: 60},
    title: 'screenName',
    headerTintColor: 'white',
    gesturesEnabled: false,            // not to go login screen back
    headerLeft: drawerButton(navigation)
  })
})

Tab Navigator:

const Screen1TabNav = TabNavigator({
  Tab1: {
    screen: StackNav, 
    navigationOptions: {
        tabBarIcon:  
    }
  },
  Tab2: {
    screen: StackNav, 
    navigationOptions: {
        tabBarIcon:
    }
  },{
    navigationOptions: {
    header: (
      <View style={[{backgroundColor: '#5E565A', height: 60}]}>
           ...
      </View>
    )
    }
  }

Stack Navigator:

const StackNav = StackNavigator({
  Main: {
    screen: Addresssearch,
  },
  Detail: {
    screen: DetailScreen,
    navigationOptions: (props) => ({
        title: "Detail",
    })
  }
  },
  { headerMode: 'none'} // Removed Header from this Stack Navigation
)

我的疑问是,如何处理 Headers .

在主屏幕上,

每当我改变 TabNavigator 时, header title 都要改变 . 在某些标签中,视图本身必须更改 .

同样的事情,每当我改变 drawer Navigator header title 都要改变 .

如何处理 stack Navigator 的可重用自定义标头?