前端vue国际化（V18n）
栏目: JavaScript · 发布时间: 7年前
内容简介：先分享一下vue的国际化，目前vue的国际化采用的是首先新建一个存放语言的文件目录,把提取后的中文、英文放在对应的文件中如下图：
目前公司在搞国际化，虽然刚开始接触，但还是遇到了一些问题，如对你有帮助，烦请点个赞，谢谢。
先分享一下vue的国际化，目前vue的国际化采用的是 vue-i18n 。
首先新建一个存放语言的文件目录,把提取后的中文、英文放在对应的文件中如下图：
通过Vue.use调用内部install方法，最后别忘了在main.js中引入，绑定在vue实例上。
在组件的html中语法:
在js中语法:
在js中调用 this.$i18n.locale = language（例：en_US，跟语言文件export出的对象名称保持一致）实现修改语言。
注意这里：
1、养成良好的变成喜欢，在写逻辑判断的时候，不要根据中文去判断，不然做国际化要改起来很麻烦。比如使用if (xxx === '中文')、xxx.indexof(‘中文’)等；
2、在使用V18n的时候我发现，在页面created之后mounted之前V18n才执行的，就意味着有些人在data（）里面用中文初始化了一些属性，但是此时V18n还没有执行，于是一些属性被赋值成了$t('xxxxx')，即键值。
如图，我在data中初始化了部分属性，然后在created时候打印该属性，发现控制台报了2个警告，然后该属性被赋值成了键值。 解决方案就是：在data中初始化时不指定默认值，在mounted的时候进行赋值就ok了
之后就可以手动调用this.$i18n.locale = en_US方法实现中英文切换了），也可以根据cookie去赋值.
最后分享一个 kiwi 插件，kiwi是一款提取替换中文的插件，喜欢的也可以试试，十分好用，大家可以看一下链接中的文档。有时间我还会出一下jquery的国际化...
以上就是本文的全部内容，希望本文的内容对大家的学习或者工作能带来一定的帮助，也希望大家多多支持 码农网
本站部分资源来源于网络，本站转载出于传递更多信息之目的，版权归原作者或者来源机构所有，如转载稿涉及版权问题，请联系我们。
企业应用架构模式
Martin Fowler、王怀民、周斌 / 王怀民、周斌 / 机械工业出版社 / 2004-7 / 49.00元
本书作者是当今面向对象软件开发的权威，他在一组专家级合作者的帮助下，将40多种经常出现的解决方案转化成模式，最终写成这本能够应用于任何一种企业应用平台的、关于解决方案的、不可或缺的手册。本书获得了2003年度美国软件开发杂志图书类的生产效率奖和读者选择奖。本书分为两大部分。第一部分是关于如何开发企业应用的简单介绍。第二部分是本书的主体，是关于模式的详细参考手册，每个模式都给出使用方法和实现信息，并一起来看看 《企业应用架构模式》 这本书的介绍吧!
