vue项目实现中英文切换

这是我个人之前做项目的一点记录，如果有问题欢迎大家指正。

1、首先npm进行安装 ： npm install vue-i18n

2、安装完成之后的main.js中配置  

       import VueI18n from ‘vue-i18n‘

  Vue.use(VueI18n)

3、在assets文件下我创建了lang文件夹 里面包含zh.js  en.js  (这两个为中英文翻译)；
之后在main.js中引入中英文翻译  如下：

const i18n = new VueI18n(
  {
    locale: window.localStorage.getItem(‘language‘) == null ? "zh" : window.localStorage.getItem(‘language‘),    // 语言标识
    messages: {
      ‘zh‘: require(‘./assets/lang/zh‘),
      ‘en‘: require(‘./assets/lang/en‘)
    }
  }
)

扩展：zh.js  如下     

module.exports ={

    home: {h1: ‘首頁‘, h2: ‘标题1‘, h3: ‘标题2‘, h4: ‘标题3‘, h5: ‘标题4‘},   //页面1

    home1: {h1: ‘首頁‘, h2: ‘标题1‘, h3: ‘标题2‘, h4: ‘标题3‘, h5: ‘标题4‘},   //页面2

}

en.js和zh.js 内容和字段必须一一对应 

使用时：<p>{{$t("header.h1")}}</p>   input使用时为  $t(‘home.h1‘)

vue项目实现中英文切换

原文：https://www.cnblogs.com/My-Blogsphere/p/12750935.html