DrawNavigator里面的StackNavigator里面的StackNavigator - 如何显示标题？

Question

这是我的应用结构。我使用了drawer, Tab and Stack Navigation的react-navigation实现了。如何处理标题？

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)
  })
})

标签导航器：

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
)

我的疑问是，如何处理标题。

在主屏幕上，

每当我更改 TabNavigator 时，header title都必须更改。在某些标签中，视图本身必须更改。

同样的，每当我更改抽屉导航器 header title时都必须更改。

如何处理堆栈导航的可重用自定义标头？