vue中的国际化i8n的使用

135 阅读1分钟

i18n的基本使用:

1:下载安装 npm i vue-i18n@8.25.1 装完后找个低版本就行


2:src/lang/index.js
  导入
   import i18n from 'vue-i18n'
3:注册
  import Vue from 'vue'
  Vue.use(i18n)
  
4:实例化
//导入elemnt-ui的语言包
import elZh from 'element-ui/lib/locale/lang/zh-CN'
import en from 'element-ui/lib/locale/lang/en'
   export default new i18n({
       locale:'什么语言(en/zh...)/en',
       messages:{
          en:{
              home:'home',
              ...en//加上饿了么语言包
          },
          zh:{
              home:'首页',
              ...elZh//加上饿了么语言包
          }
       }
   })
   
5:挂载
  main.js
   import i18n from '@/lang'
   new Vue({
       i18n:i18n
   })
   
  Vue.use(ElementUI, {
  i18n: (key, value) => i18n.t(key, value)
})
   
   
6.使用:
   首页==>$t('home')
   
   语言切换
    this.$i18n.locale='zh/en'