当前位置: 首页 > 工具软件 > guns-lite > 使用案例 >

guns-lite增加国际化功能

邓阳伯
2023-12-01

国际化

  • guns-admin-vuejs实现国际化了,不好意思guns-admin暂未实现国际化,后续也会考虑实现。
  • 不了解上面两个的区别的同学可以再回顾下这个文档
  • guns-admin-vuejs实现国际化的方式参考vue-element-admin的 官方文档,这里不再赘述,强烈建议你先把文档读了之后再看下面的内容。

默认约定

针对网站资源进行国际化涉及到的国际化资源的管理维护,这里给出一些guns-admin-vuejs的资源分类建议,当然,你也可以根据你的实际情况进行调整。

  • src/lang/为国际化资源目录,目前提供了英文(en.js)和中文(zh.js)的两种语言实现。
  • 目前资源语言资源文件中是json配置主要有以下几个节点:
    • route 左侧菜单资源
    • navbar 顶部导航栏资源
    • button 公共的按钮资源,比如:添加、删除、修改、确定、取消之类等等
    • common 其他公共的资源,比如一些弹出框标题、提示信息、label等等
    • login 登录页面资源
    • config 参数管理界面资源
  • 目前针对具体的页面资源只做了登录和参数管理两个页面,其他具体业务界面仅针对公共的按钮做了国际化,你可以参考config页面资源进行配置进行进一步配置:/src/views/cfg/
  • 如果你有其他资源在上面对应的节点添加即可,针对每个页面特有的资源以页面名称作为几点进行维护,这样方便记忆和维护,不容易出错。

添加新的语言支持

如果英文和中文两种语言不够,那么你可以通过下面步骤添加语言支持

  • 在src/lang/目录下新增对应的资源文件
  • 在src/lang/index.js中import对应的资源文件
  • 在src/lang/index.js中的messages变量中加入新的语言声明
  • 在src/components/LangSelect/index.vue的语言下拉框中增加新的语言选项

 

演示地址

 

 类似资料: