国际化

ReUI 内置轻量响应式 i18n 系统，组件内全部界面文案（占位符、按钮、空状态等）均接入，切换语言即时生效。

内置语言

语言代码
简体中文（默认）zh-CN
繁体中文zh-TW
英文en-US

语言标识自动归一化：zh-HK / zh-Hant → zh-TW，en / en-GB → en-US。

切换语言

import { setLocale, getCurrentLocale, useI18n } from "@reglow/reui";

setLocale("en-US"); // 写入 localStorage 并同步 <html lang>
const current = getCurrentLocale();

在组件中响应式使用：

<script setup lang="ts">
import { useI18n } from "@reglow/reui";
const { locale, t, setLocale } = useI18n();
</script>

<template>
  <select v-model="locale" @change="setLocale(locale)">
    <option value="zh-CN">简体中文</option>
    <option value="zh-TW">繁體中文</option>
    <option value="en-US">English</option>
  </select>
  <p>{{ t("common.confirm") }}</p>
</template>

ConfigProvider 方式

<template>
  <ConfigProvider locale="zh-TW">
    <App />
  </ConfigProvider>
</template>

API

API说明
t(key, params?)翻译文本，支持 {name} 插值；未命中回退 zh-CN，再回退 key 本身
tm<T>(key, fallback?)获取数组/对象消息（如星期列表）
setLocale(locale)切换语言（持久化到 localStorage）
getCurrentLocale()读取当前语言
addLocale(locale, messages)注册新语言或深合并覆盖内置文案
useI18n()组合式 API：{ locale, t, tm, setLocale, supportedLocales }

自定义语言包

import { addLocale } from "@reglow/reui";

// 新增日语
addLocale("ja-JP", {
  common: { confirm: "確認", cancel: "キャンセル" },
  reui: { modal: { ok: "OK" } },
});

// 或覆盖内置英文的部分文案（深合并）
addLocale("en-US", { common: { confirm: "OK" } });

单组件文案覆盖

所有文案类 prop 都支持组件级覆盖，优先级高于 i18n 默认值：

<DatePicker placeholder="Pick a date" />
<Transfer :title-text="['Source', 'Target']" />
主题定制
主色、中性色、圆角、字体与暗色模式
Button 按钮
按钮用于开始一个即时操作，标记（或封装）一组操作命令，响应用户点击行为，触发相应的业务逻辑。