How to use the react-navigation.createBottomTabNavigator function in react-navigation

// Licensed under the MIT License.

import { AppState, Alert, Platform, ToastAndroid } from 'react-native';
import { createBottomTabNavigator, createAppContainer } from 'react-navigation';

import Crashes, { UserConfirmation, ErrorAttachmentLog } from 'appcenter-crashes';
import Push from 'appcenter-push';
import Data from 'appcenter-data';

import AppCenterScreen from './screens/AppCenterScreen';
import TransmissionScreen from './screens/TransmissionScreen';
import AnalyticsScreen from './screens/AnalyticsScreen';
import CrashesScreen from './screens/CrashesScreen';
import AttachmentsProvider from './AttachmentsProvider';

const TabNavigator = createBottomTabNavigator(
  {
    AppCenter: AppCenterScreen,
    Analytics: AnalyticsScreen,
    Transmission: TransmissionScreen,
    Crashes: CrashesScreen
  },
  {
    tabBarOptions: {
      activeBackgroundColor: 'white',
      inactiveBackgroundColor: 'white',
    },
  }
);

export default createAppContainer(TabNavigator);

//TODO:更正
    MyView: {
        screen: MyView,
        navigationOptions: () => {
            return {
                headerTitle: "MyView"
            }
        }
    }
}, {
        defaultNavigationOptions: ({ screenProps }) => NavigationConfig.navConfig(screenProps)
    })
//定义一些icon

// Tab定义
let AppTab = createBottomTabNavigator({
    HomeTab: {
        screen: HomeNav,
        navigationOptions: ({ navigation }) => NavigationConfig.tabConfig("首页", ImageSources.common.icon_add, ImageSources.common.icon_sub, navigation)
    },
    MyTab: {
        screen: MyNav,
        navigationOptions: ({ navigation }) => NavigationConfig.tabConfig("我的", ImageSources.common.icon_add, ImageSources.common.icon_sub, navigation)
    }
}, {
        tabBarOptions: {
            activeTintColor: '#3A55EE',
        },
    })

//导出可用路由
export let AppRegist = createStackNavigator({

config
);

SettingsStack.navigationOptions = {
    tabBarLabel: 'Settings',
    tabBarIcon: ({ focused }) => (
        
    )
};

SettingsStack.path = '';

const tabNavigator = createBottomTabNavigator({
    HomeStack,
    LinksStack,
    SettingsStack
});

tabNavigator.path = '';

export default tabNavigator;

screen: SettingsScreen,
    navigationOptions: ({ navigation }) => {
      const headerLeftNav = addHeaderLeftNavigator(navigation);
      return { ...headerLeftNav, title: 'Settings' };
    }
  }
});

SettingsStack.navigationOptions = {
  tabBarLabel: 'Settings',
  tabBarIcon: ({ focused }) => (
    
  )
};

const BottomTabNavigator = createBottomTabNavigator({
  HomeStack,
  SettingsStack
});

export default createDrawerNavigator(
  {
    BottomTabNavigator: BottomTabNavigator
  },
  {
    contentComponent: LeftSlider
  }
);

Auth,
  Home,
  Login,
  Calendar,
  Settings,
  Subject,
  Timeline
} from '@screens'
import { wind, colorMain, colorTitle } from '@styles'

const HomeSwitch = createSwitchNavigator({
  Auth,
  Home
})

const NavBottomTab = createBottomTabNavigator(
  {
    Timeline: {
      navigationOptions: {
        tabBarIcon: ({ tintColor }) => (
          
        ),
        tabBarLabel: '时间胶囊'
      },
      screen: Timeline
    },
    Home: {
      navigationOptions: {
        tabBarIcon: ({ tintColor }) => (
          
        ),
        tabBarLabel: '进度'

import React from 'react';
import {createAppContainer, createBottomTabNavigator, createStackNavigator} from 'react-navigation';
import Icon from 'react-native-vector-icons/FontAwesome';
import {MultiBar, MultiBarToggle} from 'react-native-multibar';

import {Bookmarks, Likes, Private, Profile, Settings} from "../components";
import {Routes} from "./Routes";

const TabsNavigator = createBottomTabNavigator({
    [Routes.TabsBookmarks]: {
        screen: Bookmarks,
        navigationOptions: () => ({
            tabBarIcon: ({tintColor}) => (
                
            )
        })
    },
    [Routes.TabsLikes]: {
        screen: Likes,
        navigationOptions: () => ({
            tabBarIcon: ({tintColor}) => (

style={styles.headerImage}
                        />
                    
                );
            }),
        }
    },
    Details: {
        screen: CardDetails,
        navigationOptions: ({ navigation }) => ({
            title: `${navigation.state.params.headerTitle}`,
        }),
    },
});

export const RootNavigator = createBottomTabNavigator({
    Home: {
        screen: HomeStack,
        navigationOptions: {
            tabBarLabel: 'Home',
            tabBarIcon: ({ tintColor }) => (
                
            ),
        },
    },
    Viz1: {
        screen: Viz1,
        navigationOptions: {
            tabBarLabel: 'Viz1',
            tabBarIcon: ({ tintColor }) => (
                
            ),

import {
  createBottomTabNavigator,
  createSwitchNavigator,
  createAppContainer
} from "react-navigation";
import SignupScreen from "./screens/SignupScreen";
import SigninScreen from "./screens/SigninScreen";
import AuthLoadingScreen from "./screens/AuthLoadingScreen";
import HomeScreen from "./screens/HomeScreen";

const AuthStack = createBottomTabNavigator({
  Signup: SignupScreen,
  Signin: SigninScreen
});

const AppStack = createBottomTabNavigator({
  Home: HomeScreen
});

export default createAppContainer(
  createSwitchNavigator(
    {
      AuthLoading: AuthLoadingScreen,
      Auth: AuthStack,
      App: AppStack
    },
    {

return createStackNavigator({ Component }, config);
}

const AuthNavigator = createStackNavigator(
	{
		Welcome,
		Login,
		InitialQuestionaire: createQuestionnaire(questionnaires.initial),
		CheckUrls
	},
	{
		initialRouteName: 'Welcome'
	}
);

const CreatePlan = createBottomTabNavigator(
	{
		CanvasAssignments,
		CustomAssignments
	},
	{
		initialRouteName: 'CanvasAssignments'
	}
);

const BattlePlanAndAllowNotifications = createStackNavigator(
	{
		BattlePlan,
		AllowNotifications
	},
	{
		mode: 'modal',