vue+antd实现国际化

Vue中的国际化一、安装（一）安装vue-i18n//npminstallvue-i18n--save2、新建一个国际化文件（一）在需要国际化的assets下新建一个文件语言文件eg：对应的语言包，使用key和value的形式en-US写对应的英文，zh-CN写对应的中文包ps：中英文文件中对应的key值应该相同，值为对应的语言值3.参考文件//引用main.js中的语言包importVueI18nfrom'vue-i18n'//使用vue-i18n插件Vue.use(VueI18n)consti18n=newVueI18n({locale:'zh-CN',//语言表示，通过切换本地消息来切换本地语言:{'en-US':require('./assets/lang/en-US');//中文语言包'zh-CN':require('./assets/lang/zh-CN');//英文语言包}})newVue({el:'#app',i18n,components,template:''})4，在xxx.vue文件中使用，使用LocaleProvider在文件周围包裹一次全局生效eg:5、具体使用（1）在HTML

(`2)控制台。log(this.$t('key.value'));`(3)在vue实例外的js代码中进行文本替换方法一：在文件中importi18nimport方法二：将i18n挂到window下，就变成了一个全局变量，所以不需要在每个文件中都导入i18neg：//window.i18n=i18ninmain.js(4)在js文件中使用eg:1.xxx.js中，有如下定义规则：2.html中的校验规则定义在js文件中，定义$t会报错，导入i18n也会报错第一步：全局挂载i18n第二步：在js文件中导入：importmomentfrom'monent'第三步：在需要国际化的字段写message：i18n.t('key.value')ps也可以这样写将文本信息字段国际化的公共方法eg：在公共文件中引入importmomentfrom'moment'/***公共方法国际化消息，仅针对上述纹理信息，可以自行处理*/exportfunctiongetMessage(rule){for(letiinrule){//遍历规则if(rule[i].length>1){//会有多条信息需要校验，这里只遍历得到校验信息数据for(letj=0,l=rule[i][1].rules.length;i

上一篇：elementui表单验证TypeError-callbackisnotafunction

下一篇：沃特福德球员应该更自信一些，现在回归训练场更安全

vue+antd实现国际化相关文章