方法1 Vue — i18n 国际化 全局配置

安 装

1.直接引入js文件

<script src="https://unpkg.com/vue/dist/vue.js"></script>

<script src="https://unpkg.com/vue-i18n/dist/vue-i18n.js"></script>

2.NPM安装

npm install vue-i18n

安装Yarn

yarn add vue-i18n

main.js

 import Vue from 'vue'
import VueI18n from 'vue-i18n'
Vue.use(VueI18n) const i18n = new VueI18n({
//切换语言直接修改locale的值即可
  //this.$i18n.locale = ..
locale: 'zh-CN',
//使用require引入中英文文件
messages:{
  "EN": require('./EN.js'),
  "zh-CN": require('./zh-CN.js')
  }
}) new Vue({
el: '#app',
i18n,
router,
template: '<app/>',
components: {
  app,
    i18n
  }
})

ZN.js

 export const message = {
  AllProduct: '全部产品',
  LatestReports:"最新报道"
}

EN.js

 export const message = {
  AllProduct: 'ALL PRODUCT',
  LatestReports: "LATEST REPORTS"
}

index.vue

 <template>
  <div>
    {{$t('message.AllProduct')}}
  </div>
</template> //全部产品

还有一种配置全局变量得方法, 不过不建议使用, 就不贴上来了!

 

最新文章

  1. longjmp setjmp and volatile
  2. 常见sizeof 笔试题
  3. shell script的连接符是逗号,不是英文的句号
  4. div 滚动定位代码
  5. MongoDB开发应用实战
  6. webpack下css/js/html引用图片的正确方式
  7. 软件工程作业-(third)
  8. 2017-2018-2 20165234 实验四《Android程序设计》实验报告
  9. activiti5/6 系列之--流程复用技术 callActivity
  10. Java版 人脸识别SDK dem
  11. Scala的内建控制结构
  12. #pragma alloc_text
  13. SpringBoot开发案例之整合Kafka实现消息队列
  14. 【mybase】绿色版---mybase非常好用的笔记软件
  15. Video如何不自动全屏播放?
  16. Python笔记 #09# Basic plots with matplotlib
  17. Socket 编程(二)
  18. 跟踪Makefile输出调试信息
  19. js作用域对象与运用技巧
  20. JS跳转页面的几种方法

热门文章

  1. 【Lucene】具体解释Lucene全文检索的信息写入与读取
  2. 使用RTL-SDR,从打开一个车门到批量打开车门
  3. VisualSVN Server 导入已存在的库
  4. Python机器学习--回归
  5. android 获取屏幕宽高 和 获取控件坐标
  6. 阿里云serverMySQL无法连接问题解决纪实
  7. python基础小练习
  8. Vim经常使用技巧总结2
  9. openwrt gstreamer实例学习笔记(七. gstreamer 缓冲区(Buffers)和事件(Events))
  10. Codeforces Round #420 (Div. 2) E. Okabe and El Psy Kongroo DP+矩阵快速幂加速