vue-i18n安装，$t的用法

 

1、在 main.js 中引入 vue-i18n （前提是要先引入 vue）

import VueI18n from'vue-i18n'
Vue.use(VueI18n)

 

2、准备本地的翻译信息

const messages = {
  zh: {
    message: {
      hello:'好好学习，天天向上！'
    }
  },
  en: {
    message: {
      hello:'good good study, day day up!'
    }
  }
}

 

3、创建带有选项的 VueI18n 实例

const i18n = new VueI18n({
  locale:'en',// 语言标识
  messages
})

 

4、把 i18n 挂载到 vue 根实例上

const app =new Vue({
   router,
   i18n,
   ...App
}).$mount('#app')

 

5、html写入

 

使用$t方法实现国际化

<span>{{ $t('header.HeadMenu.logout') }}</span>

或者用v-text

<span v-text="$t('header.HeadMenu.logout')"></span>