How to nest navigators with wrapping Views in React native

I want to have a nested view between my DrawerNavigator and my TabNavigator but I cannot get it to work.

Code:

const SubNavigation = TabNavigator({
  SubOne: { screen: SubOne },
  SubTwo: { screen: SubTwo },
}, {
  tabBarComponent: TabBarTop,
  tabBarPosition: 'top',
  initialRouteName: 'SubOne',
});

class SubScreen extends Component {
  static navigationOptions = {
    title: 'Subscreen',
  };

  render() {
    const { navigation } = this.props;
    return (
      <View>
        <Header navigation={navigation} />
        <SubNavigation navigation={navigation} />
      </View>
    );
  }
}

const PrimaryNav = DrawerNavigator({
  StartScreen: { screen: StartScreen },
  SubScreen: { screen: SubScreen },
}, {
  initialRouteName: 'StartScreen',
});

I do it like this because I want a custom header for each PrimaryNav screen. I don't really know if this is best practice, I am used to use react-router where you can define container components similar to this.

I get the error Cannot read property 'forEach' of undefined with the code above.