Vue 低代码国际化使用

一、背景：Vue 低代码的多语场景

浪潮海岳 inBuilder 低代码平台现在已支持 Vue 技术栈。在 Vue 低代码使用过程中同样遇到多语场景。为了解决 Vue 低代码的多语言场景，我们推出了 Vue 低代码多语解决方案，解决了多语问题，提高多语场景下的开发效率。下面小编将详细介绍 Vue 的多语国际化方案。

二、国际化配置

• 在我们一个表单开发完成后，点击保存，会在元数据列表里生成对应资源的源数据：

• 点击打开即可看到我们提取到的页面上的中文资源，与其对应的资源编号：

• 在上面切换到对应语言，即可配置对应语言的资源翻译，其中繁体语言是自动生成的：

• 配置完成后点击保存，发布。

三、国际化使用

• 当非开发语言使用低代码功能时，在登入页右上角切换到使用人的语言，然后登入：

• 打开配置的页面，页面已经是使用人选择的语言了：

四、Vue 多语功能易用性提升

Vue 版低代码多语实现方案与 Angular 版低代码大致相似，只是提取方案有所不同，Vue 版资源项编号摒弃了冗长的资源项全路径，只保留最基础的部分，使得可以更明晰的辨别的资源项。

Vue 版低代码抽取资源时优化了提取路径，使得在有唯一标识的情况下，资源项可以更好的被辨认。比如在表格中的资源项，在 Vue 版中直接优化了表格相关前缀。一些组件的资源提供了多语默认值，使用默认值的时候不会被提取到列表，只有修改使用自定义值后，才会被提取出资源项。

欢迎大家积极留言共建，期待与各位技术大咖的深入交流！

此外，欢迎大家下载我们的inBuilder低代码社区，可免费下载使用，加入我们，开启开发体验之旅！