react-i18next如何通过t函数访问嵌套动态键？

要通过t()函数访问roles[RACE_DRIVER]?.title这类嵌套动态键，你可以按照以下方式处理：

核心问题说明 #

你的翻译文件中使用了[RACE_DRIVER]作为对象键，这意味着实际生成的键是RACE_DRIVER常量的取值（比如'raceDriver'），而非字面量字符串'RACE_DRIVER'。因此调用t()时，需要动态拼接这个实际键值。

可行解决方案 #

1. 使用模板字符串拼接键 #

直接将动态变量嵌入键路径中：

// 假设RACE_DRIVER是已定义的常量，值如'raceDriver'
t(`roles.${RACE_DRIVER}.title`)

2. 使用数组作为键参数 #

i18next支持传入数组形式的键路径，自动拼接为嵌套结构：

t(['roles', RACE_DRIVER, 'title'])

3. 处理键不存在的 fallback 场景 #

如果担心动态键可能不存在，可以添加默认值：

t(`roles.${RACE_DRIVER}.title`, { defaultValue: 'Driver' })

关键检查点 #

• 确保RACE_DRIVER常量在ENTranslation.js中可访问，且其值与你期望的键名一致（比如const RACE_DRIVER = 'raceDriver'）
• 确认ENTranslation.js正确导出了翻译对象，例如：

// ENTranslation.js
const RACE_DRIVER = 'raceDriver';
const TEAM_MANAGER = 'teamManager';

export const ENTranslation = {
  roles: {
    [RACE_DRIVER]: {
      title: 'Race driver',
      titleShort: 'Driver',
      description: 'This is a driver description'
    },
    [TEAM_MANAGER]: {
      title: 'Team manager',
      titleShort: 'Manager',
      description: 'This is a team description'
    },
  }
};

内容的提问来源于stack exchange，提问作者Amaka