Drawer Navigation Screen Title Not Showing

[UsamaAltaf]

<template>
  <app-navigator></app-navigator>
</template>

<script>
import {
  createAppContainer,
  createStackNavigator,
  createDrawerNavigator,
} from 'vue-native-router';
import Vue from 'vue-native-core';
import {VueNativeBase} from 'native-base';
Vue.use(VueNativeBase);
import LoginScreen from './screens/Login.vue';
import TenantScreen from './screens/TenantDetails.vue';
import InvoiceScreen from './screens/TenantInvoices.vue';

const DrawerNavigator = createDrawerNavigator(
  {
    Login: LoginScreen,
    TenantDetails: TenantScreen,
    TenantInvoices: InvoiceScreen,
  },
  {
    initialRouteName: 'Login',
    contentOptions: {
      activeTintColor: '#000000',
      activeBackgroundColor: '#e6e6e6',
    },
  },
);

const StackNavigator = createStackNavigator({
  Drawer: DrawerNavigator,
  Login: {
    screen: LoginScreen,
    navigationOptions: {
      headerTitle: 'Login',
    },
  },
  TenantDetails: {
    screen: TenantScreen,
    navigationOptions: {
      headerTitle: 'Tenant Details',
    },
  },
  TenantInvoices: {
    screen: InvoiceScreen,
    navigationOptions: {
      headerTitle: 'Tenant Invoices',
    },
  },
});
const AppNavigator = createAppContainer(StackNavigator);
export default {
  components: {AppNavigator},
};
</script>

As you can see in StackNavigator I added navigationOption for all screens cause I want different titles but the titles are not showing I tried title instead of headerTitle and also tried this DrawerNavigator how can I show titles for different screen I don't want to use Custom Header