I18N 多语言

简介

I18N 用于处理面板中的多语言。

代码演示

I18N 处理面板中的多语言的操作步骤如下：

1. 定义多语言。

   说明：在 src/i18n/strings.{js,ts} 文件中进行编辑。

   // en 和 zh 必须都定义
   module.exports = {
     en: {
       hello: 'Hello',
     },
     zh: {
       hello: '你好',
     }
   };
   

2. 生成并导出多语言。

   import { I18N } from 'tuya-panel-kit';
   
   const Strings = require('./strings');
   
   module.exports = new I18N(Strings);
   

3. 使用多语言。

   import Strings from '../i18n';
   
   const localizedText = Strings.getLang('hello');
   
   console.log(localizedText);
   

4. 多语言 key 命名规范

   说明： bitmap 类型详情参见 bitmap 型如何使用。

   module.exports = {
     en: {
       dsc_edit: 'Edit', // Basic multi language with dsc_ start and name it semantically
       dp_switch: 'Switch', // Datapoint (DP) related multi language should be in accordance with the `dp_${dpCode}`
       dp_switch_on: 'Switch is On', // Boolean type datapoint related multi language should be in accordance with the `dp_${dpCode}_${'on' || 'off'}`
       dp_mode_smart: 'Smart Mode', // Enum type datapoint related multi language should be in accordance with the `dp_${dpCode}_${enumValue}`
       dp_fault_0: 'Binary first bit is faulty', // Bitmap type datapoint related multi language should be in accordance with the `dp_${dpCode}_${bit}`
       dp_fault_1: 'Binary second bit is faulty',
     },
     zh: {
       dsc_edit: '编辑', //  基础多语言以 dsc_ 开头并命名语义化即可
       dp_switch: '开关', // 功能点（DP）相关多语言需按照 `dp_${dpCode}` 进行命名
       dp_switch_on: '开关开', // 布尔类型功能点状态相关多语言需按照 `dp_${dpCode}_${'on' || 'off'}` 进行命名
       dp_mode_smart: '智能模式', // 枚举类型功能点状态相关多语言需按照 `dp_${dpCode}_${enumValue}` 进行命名
       dp_fault_0: '第一位故障', // Bitmap 类型功能点状态相关多语言需按照 `dp_${dpCode}_${bit}` 进行命名
       dp_fault_1: '第二位故障',
     }
   };
   

方法

getLang

/**
 * @desc 获取基础多语言
 * @param {String} key - 多语言字段
 * @returns {String} 具体多语言值
 */
// en: Back; zh: 返回;
// 如果找不到: i18n@back;
Strings.getLang('back'); // -> Strings.back

getDpLang

/**
 * @desc 获取 DP 多语言
 * @param {String} dpCode - dpCode 名
 * @param {String|Number} value - dp 点值
 * @returns {String} 具体多语言值
 */
// en: Mode1; zh: 模式1;
// 如果找不到: dp_mode_1;
Strings.getDpLang('mode', 1); // -> Strings.dp_mode_1

formatValue

/**
 * @desc 拼接多语言
 * @param {String} key - 多语言字段
 * @param {...String|Number} values - 需要匹配替换的值，可以为多个
 * @returns {String} 具体多语言值
 */
// 定义 => en: "Turn on after {0}" ; zh: 设备将在{0}后开启 
// 结果 => en: Turn on after 1 minute; zh: 设备将在1分钟后开启
Strings.formatValue('countdown_on', '1分钟');