GHHub/src/i18n

目录结构

├── locales
│ ├── en
│ │ ├── common.json
│ │ ├── [ns].json
│ ├── zh
│ │ ├── common.json
│ │ ├── [ns].json

1. 翻译的资源文件位于 public/locales 文件夹，文件夹结构是 [语言] > [命名空间].json.
   [语言]命名使用短格式, 暂不考虑区分地区差异. 如: en-GB, en-US, en-AU 均使用en
2. common.json 是公共的 json 文件，存放一些公共的 key-value
3. [ns].json 是命名空间 json 文件，存放一些命名空间的 key-value
4. 命名空间根据自己的需求/功能模块来创建，比如：group(团计划), feedback(反馈表)等
5. json 文件中的 key 使用驼峰命名

⭐DEV

1. 翻译的资源文件位于 public 下, 切换语言时异步请求.
2. 开发过程编辑了 locales/*.json 后, 需要刷新页面才会生效. 热加载不生效
3. 新增的命名空间, 添加到 src/i18n/index.js 中配置的 init({ ns }) 中

⭐⭐ 组件中使用

1. 默认 common 命名空间
2. 取值: t('[ns]:[json_path]'), json path 的层级使用.分隔

import { useTranslation } from 'react-i18next';

const { t } = useTranslation();
// const { t, i18n } = useTranslation('group'); // 指定命名空间

// 默认common命名空间
<button >{t('Search')}</button>
<button >{t('datetime.thisWeek')}</button>

// 命名空间取值
<button >{t('group:ArrivalDate')}</button>

⭐⭐⭐ 格式: 日期, 金额等

文档 Formatting