错误结合createStackNavigator和createBottonTabNavigator

Question

我正在尝试将createStackNavigator和createBottomTabNavigator与React Navigator 3组合在一起，但出现此错误：

一切正常如果删除createStackNavigator。使用的主要原因createStackNavigator是显示选项卡的标题和图标右上角一个设置。

import React, {Component} from 'react';
import { StyleSheet, Text, View, Platform } from 'react-native';


import { createBottomTabNavigator, createStackNavigator, createAppContainer  } from 'react-navigation'

import HomeTab from './AppTabNavigator/HomeTab'
import MyCareerTab from './AppTabNavigator/MyCareerTab'
import CourseAgendaTab from './AppTabNavigator/CourseAgendaTab'
import ClassTab from './AppTabNavigator/ClassTab'
import SettingsTab from './AppTabNavigator/SettingsTab'


class MainScreen extends React.Component{


  render(){
    return
    <View><Text>Hello</Text></View>
    }

}

const DashboardTabNavigator = createBottomTabNavigator({
    HomeTab,
    MyCareerTab,
    ClassTab,
    CourseAgendaTab,
}, {
    navigationOptions: ({ navigation }) => {
        const { routeName } = navigation.state.routes[navigation.state.index];
        return {
            headerTitle: routeName
        };
    }
});

const DashboardStackNavigator = createStackNavigator({
    DashboardTabNavigator: DashboardTabNavigator
});

export default createAppContainer(DashboardStackNavigator);

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
});