Question

我有一个适用于本机应用程序的 i18next 设置。我唯一想念的是检索用户在 AsyncStorage 中保存的语言环境。

i18next 使您有机会在应用程序启动之前设置区域设置，这要归功于 18n.use(()=> "locale")。只要函数不是异步的，它就可以正常工作。

问题是 AsyncStorage 是异步的并且需要 await 关键字。如果我这样做，应用程序就会崩溃。到目前为止，我唯一的选择是不允许用户更改其区域设置并始终使用其设备的区域设置。

有办法解决吗？这是我的代码（detectLocale() 中有问题的 async/await）。

const detectLocale =  async () => {
  const storedLocale = await AsyncStorage.getItem("my-locale");
  if (storedLocale) {
    return JSON.parse(storedLocale);
  }
  const mobileLocale =
    Platform.OS === "ios"
      ? NativeModules.SettingsManager.settings.AppleLocale ||
        NativeModules.SettingsManager.settings.AppleLanguages[0]
      : NativeModules.I18nManager.localeIdentifier;
  if (mobileLocale) {
    return mobileLocale.split("_")[0];
  }
  return languages.EN;
};

const languageDetector = {
  type: "languageDetector" as LanguageDetectorAsyncModule["type"],
  async: false,
  detect: detectLocale,
  init: () => {},
  cacheUserLanguage: () => {},
};

export default i18n
  .use(languageDetector)
  .use(initReactI18next)
  .init({
    resources,
    fallbackLng: languages.EN,
    keySeparator: ".",
    whitelist: [languages.EN, languages.FR],
    interpolation: { escapeValue: false },
  });

谢谢！

Answer 1

const detectLocale =  async (callback) => {
  const storedLocale = await AsyncStorage.getItem("my-locale");
  if (storedLocale) {
    return callback(JSON.parse(storedLocale));
  }
  const mobileLocale =
    Platform.OS === "ios"
      ? NativeModules.SettingsManager.settings.AppleLocale ||
        NativeModules.SettingsManager.settings.AppleLanguages[0]
      : NativeModules.I18nManager.localeIdentifier;
  if (mobileLocale) {
    return callback(mobileLocale.split("_")[0]);
  }
  return callback(languages.EN);
};

const languageDetector = {
  type: "languageDetector" as LanguageDetectorAsyncModule["type"],
  async: true,
  detect: detectLocale,
  init: () => {},
  cacheUserLanguage: () => {},
};

export default i18n
  .use(languageDetector)
  .use(initReactI18next)
  .init({
    resources,
    fallbackLng: languages.EN,
    keySeparator: ".",
    whitelist: [languages.EN, languages.FR],
    interpolation: { escapeValue: false },
  });

如何使用 i18next 获取存储在 AsyncStorage 中的语言环境？

1 个答案: