与后端i18n类似,EggBornJS也实现了前端模块级别国际化特性

  1. 模块可以单独实现自己的国际化
  2. 项目级别国际化可以覆盖模块级别国际化

定义语言资源

EggBornJS默认语言是en-us,如果需要支持中文,就需要添加zh-cn资源文件

src/module/test-party/front/src/config/locale/zh-cn.js

export default {
  ...
  'Hello World': '世界,您好',
  ...
};

使用语言资源

EggBornJS通过方法this.$text根据客户端的locale配置动态使用相应的语言资源

src/module/test-party/front/src/kitchen-sink/pages/guide.vue

onPerformClick5() {
  const params = {
    message: this.$text('Hello World'),
    markCount: this.$config.markCount,
  };
  return this.$api.post('kitchen-sink/guide/echo4', params).then(data => {
    this.message4 = data;
  });
},

如何修改客户端的locale配置?

  • 打开首页,依次进入我的->信息,修改本地化属性,保存,然后刷新页面即可

覆盖语言资源

使用项目级别的语言资源覆盖模块级别的语言资源,从而将世界,您好改为您好,世界

src/front/config/locale/zh-cn.js

export default {
  'Hello World': '您好,世界',
};