vue国际化解决方案,

　　本文介绍了vue实现网络语言国际转换的方法。边肖认为这很好。现在分享给大家，给大家一个参考。来和边肖一起看看吧。

一、基本步骤

1：安装yarn add vue-i18n

　　创建新的。该路径下的js文件：src/lang/index.js:

2:导入

　　从“vue-i18n”导入VueI18n

3:注册

　　从“vue”导入Vue

　　Vue.use(VueI18n)

4:实例化

　　const i18n=new VueI18n({

　　区域设置：“当前语言的ID”，//en:英语zh:中文

　　消息：{

　　//语言包

　　恩：{

　　家：“家”

　　},

　　张：{

　　主页：“主页”

　　}

　　}

　　})

5:暴露出去

　　导出默认i18n

6:挂载到main.js

　　从“@/lang”导入i18n

　　新Vue({

　　i18n

　　})

　　使用：div{{$t(home)}}/home

二、在main.js中导入element-ui国际化语言配置

　　从导入i18n。/lang/index

　　从“element-ui”导入ElementUI

　　Vue.use(ElementUI，{

　　i18n:(键，值)=i18n.t(键，值)

　　})

三、新建一个.vue文件通过按钮实现语言切换

　　注意：

　　这个。$i18n.locale可以获取和设置js文件中使用的当前语言的国际化。

四、实现网站菜单的国际化处理，需要在路由中引入

　　从 @/lang 中导入i18n，后跟i18n.t==this。$ t

　　至此，这篇关于vue实现web语言国际切换的文章已经介绍到这里。希望对大家的学习有帮助，也希望大家多多支持。

郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。