多语言

Multilingual 模块 提供了系统语言环境的侦测、锁定以及运行时语言包的管理能力。它是 @techui/locales 能够自动工作的底层逻辑支撑。

引入方式

import { initLang, lockLang, tLang } from "@techui/utils";

初始化与锁定

initLang(val)

初始化或获取当前系统语言。

• 自动模式 (val 为空): 会优先检查会话存储中是否已锁定语言。若未锁定，则通过 Intl API 或 navigator.language 自动侦测浏览器环境，并归一化为 cn (简中), hk (繁中/香港), en (英文) 等标准代码。
• 手动模式 (val 有值): 强制设置并锁定当前语言，等同于调用 lockLang(val)。

// 自动侦测并初始化
const browserLang = initLang(); 

// 强制初始化为英文
initLang('en');

lockLang(lang)

锁定语言偏好。

将目标语言代码写入 SessionStorage，并标记 sysLangLock 为 true。这确保了即便刷新页面或浏览器语言设置变更，用户的选择依然具有最高优先级。

// 用户点击切换语言时调用
lockLang('jp');

资源管理

tLang 是一个 I18nManager 类的单例实例，负责在内存中暂存和管理当前加载的语言数据。

tLang.register(config)

注册语言包。通常由 @techui/locales 中的各个语言包文件在被 import 时自动调用。

• config: 包含 value (语言标识) 和 data (翻译数据) 的配置对象。

tLang.register({
  value: 'cn',
  data: { 
    welcome: '欢迎使用',
    start: '开始'
  }
});

tLang.getData()

获取当前内存中已注册的语言翻译数据对象。

const messages = tLang.getData();
console.log(messages.welcome); // "欢迎使用"

tLang.getValue()

获取当前已注册的语言代码标识（如 cn, en）。

const currentCode = tLang.getValue();

tLang.hasLang()

检查内存中是否已存在有效的语言数据。常用于判断是否需要发起网络请求去动态加载语言包。

if (!tLang.hasLang()) {
  // 执行动态加载逻辑...
}