介绍

为了解决gs应用的国际化文案问题，GS利用在SystemService提供了tr/setLocal/getLocal函数；

函数定义以及使用说明如下：

  1. /**
  2.  * @function setLocale
  3.  * @description 给上下文设置locale值
  4.  * @param {String} locale locale值
  5.  * @returns {Void}
  6.  * @example
  7.  * sys.setLocale("en_US");
  8.  * sys.setLocale("zh_CN");
  9.  */
  10. setLocale(locale) {}
  12. /**
  13.  * @function getLocale
  14.  * @description 获取上下文locale值
  15.  * @returns {String} locale值
  16.  * @example
  17.  * sys.getLocale();
  18.  */
  19. getLocale() {}
  21. /**
  22.  * @function tr
  23.  * @description 动态匹配需要国际化的内容
  24.  * @param {String} format 原始文本，支持模版替换
  25.  * @param {Object} arg1 可选：模版动态变量替换值
  26.  * @param  {...Object} argN 可选：模版动态变量替换值
  27.  * @returns {String} 根据locale值返回对应的国际化文本，如果未配置则返回原始值
  28.  * @example
  29.  * var locale = 'en_US';
  30.  * setLocale(locale); // 在当前context设置locale为zh_CN
  31.  * var desc1 = tr("这是一个需要在界面上展示的中文描述"); // locale为英文，desc1优先匹配应为描述，如果未配置则返回原始值
  32.  * var desc2 = tr("这是另一个需要界面上展示的中文描述");
  33.  * var desc4 = tr("这是一个{0}模版", name); // 这是一个占位符模版
  34.  * var desc5 = tr("{1}本书一共{0,number,currency}。"); // 这是另一个占位符使用模版
  35.  *
  36.  * // var desc5 = tr("这是一个" + name + "模版"); // 这种写法不支持
  37.  * // var desc = tr("这是一个") + name + tr("模版"); // 此写法会影响整体翻译，不建议使用
  38.  * //var desc4 = tr(`这是一个${a + b}模版`); // 此占位符方式Griffin Script暂不支持
  39.  */
  40. tr(format, arg1, ...argN) {}

如何使一个应用具有国际化文案的能力

1. 在profile引入SystemService扩展

  1. <bean class="com.cainiao.loginx.edge.SystemService" name="sys"/>

2. 编写gs代码，动态指定语言并用tr包装默认文案

  1. let locale = 'en_US'; // 这里可根据不同条件动态获取
  2. sys.setLocale(locale); // 设置需要展示的语言
  4. for (let i = 0; i < 10; i++) {  
  5.     labor.scan("/pages/scan/index.lemo.json", {
  6.       "header_title": sys.tr("测试标题"), // 用sys.tr包装需要支持国际化的文案 
  7.       "guide_text": sys.tr("这是测试标题"),
  8.       "bottom_tip": sys.tr("< 按左键可手动输入")
  9.     });
  10. }

3. 上传应用并在对应项目编辑对应语言的文案

4. 重新上传应用，并配置部署规则

5. 验证语言是否切换

pageflow props支持国际化文案配置

  1.     <service name = "pageFlow"  class= "com.cainiao.loginx.edge.pageflow.FlowService">
  2.         <function name = "scanContainer" action="router" page="/pages/scanContainer">
  3.             <props>
  4.                 {
  5.                     "foo": "#{some text to be translated}", // 用#{} 配置需要国际化的文案
  6.                     "bar": "#{some other text to be translated} and more text"
  7.                 }
  8.             </props>
  9.         </function>
  10.     </service>