React Native本地化场景下，如何正确导出含文本的JavaScript文件？

嘿，这事儿简单，我给你一步步说清楚怎么正确导出你的多语言配置文件～

首先，先把你的语言配置补全（你之前的法语部分没写完，我先帮你补个完整示例），然后根据你的需求选择合适的导出方式：

1. 默认导出（最常用的方式） #

创建一个单独的本地化文件，比如src/utils/Localization.js，把你的多语言配置写进去，然后直接导出strings实例：

import LocalizedStrings from 'react-native-localization';

// 完整的多语言配置
const strings = new LocalizedStrings({
  "en-US": {
    how: "How do you want your egg today?",
    boiledEgg: "Boiled egg",
    softBoiledEgg: "Soft-boiled egg",
    choice: "How to choose the egg"
  },
  en: {
    how: "How do you want your egg today?",
    boiledEgg: "Boiled egg",
    softBoiledEgg: "Soft-boiled egg",
    choice: "How to choose the egg"
  },
  fr: {
    how: "Comment voulez-vous votre œuf aujourd'hui?",
    boiledEgg: "Œuf dur",
    softBoiledEgg: "Œuf mollet",
    choice: "Comment choisir l'œuf"
  }
});

// 默认导出这个实例
export default strings;

怎么在组件里使用？ #

在任意需要用多语言文本的组件中导入：

import strings from '../utils/Localization';

// 然后直接调用对应的key就行
<Text>{strings.how}</Text>

2. 命名导出（适合需要导出多个相关内容的场景） #

如果你还需要导出一些和本地化相关的工具函数（比如切换语言的方法），可以用命名导出：

import LocalizedStrings from 'react-native-localization';

export const strings = new LocalizedStrings({
  // 同样的多语言配置
  "en-US": { /* ... */ },
  en: { /* ... */ },
  fr: { /* ... */ }
});

// 导出一个切换语言的工具函数
export const switchAppLanguage = (languageCode) => {
  strings.setLanguage(languageCode);
};

导入使用的方式： #

import { strings, switchAppLanguage } from '../utils/Localization';

// 使用文本
<Text>{strings.boiledEgg}</Text>

// 切换语言（比如切换成法语）
switchAppLanguage('fr');

额外优化建议：拆分语言配置到单独JSON文件 #

如果你的多语言内容很多，把所有语言写在一个JS文件里会很乱，建议把每种语言的配置拆成单独的JSON文件：

1. 创建src/locales/en.json：

{
  "how": "How do you want your egg today?",
  "boiledEgg": "Boiled egg",
  "softBoiledEgg": "Soft-boiled egg",
  "choice": "How to choose the egg"
}

2. 创建src/locales/fr.json：

{
  "how": "Comment voulez-vous votre œuf aujourd'hui?",
  "boiledEgg": "Œuf dur",
  "softBoiledEgg": "Œuf mollet",
  "choice": "Comment choisir l'œuf"
}

3. 然后在Localization.js中导入这些JSON：

import LocalizedStrings from 'react-native-localization';
import en from '../locales/en.json';
import fr from '../locales/fr.json';

const strings = new LocalizedStrings({
  "en-US": en,
  en: en,
  fr: fr
});

export default strings;

这样维护多语言内容会更清晰，也方便翻译人员单独编辑JSON文件～

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