Я не могу изменить язык с экземпляром i18n в index.js и экземпляром vue в main.js, событием click в xx.vue

Question

Я не могу изменить язык, когда запускаю событие click в файле xxx.vue. Создайте новый экземпляр i18n в index.js и экспортируйте его, как показано ниже

import Vue from 'vue'
import Router from 'vue-router'
import VueI18n from 'vue-i18n' //change language
Vue.use(Router)
Vue.use(VueI18n)
export const i18n = new VueI18n({
  locale: 'zh-CN',    // the language indicator
  //this.$i18n.locale 
  messages: {
    'zh-CN': require('@/locales/zh'),   
    'en-US': require('@/locales/en')    
  }
})

, и я хочу использовать i18n в том же index.js, что и ниже

export const asyncRoutes = [
  {
    path: '/monitor',
    component: Layout,
    redirect: '/monitor/monitorview',
    name: 'Monitor View',
    meta: { title: i18n.t('m.monitorView'), icon: 'example',roles: ['role.monitor.management'] },
    alwaysShow: true,

..... ......... фрагмент кода ......... meta: {title: i18n.t ('m.monitorView')

new Vue inmain.js с i18n, как показано ниже

import Vue from 'vue'
import 'normalize.css/normalize.css' // A modern alternative to CSS resets
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
import locale from 'element-ui/lib/locale/lang/en' // lang i18n
import '@/styles/index.scss' // global css
import App from './App'
import store from './store'
import router from './router'
import '@/icons' // icon
import '@/permission' // permission control
import { i18n } from '@/router/index'

Vue.use(ElementUI, { locale })

Vue.config.productionTip = false
const vm = new Vue({
    el: '#app',
    i18n,
    router,
    store,
    render: h => h(App)
})

нажмите даже, чтобы изменить язык в xxx.vue

import { mapGetters } from 'vuex'
import Breadcrumb from '@/components/Breadcrumb'
import Hamburger from '@/components/Hamburger'
export default {
  components: {
    Breadcrumb,
    Hamburger
  },
  computed: {
    ...mapGetters([
      'sidebar',
      'avatar'
    ])
  },
  methods: {
    changeLangEn() {
    this.lang = 'en-US';
    this.$i18n.locale = this.lang;//change the language
    },

    changeLangCn() {
    this.lang = 'zh-CN';
    this.$i18n.locale = this.lang;//change the language
    //this.$store.dispatch('update_current_lang', this.lang)
    }
  }
}

Я новичок в Vue, понятия не имею, где что-то пошло не так,Предложение действительно оценит.