使用i18next在React Native中动态更新应用程序语言

时间:2018-10-22 12:36:49

标签: android react-native

我想创建一个反应本机应用程序,即使我们没有在应用程序内部手动设置语言,也应该在更改设置语言的同时更改语言。 我已经在应用程序内手动设置了语言。如果我们进行了设置,则不必根据系统语言来设置应用程序语言。

我没有手动设置语言,而是更改了系统语言。但是应用程序语言没有改变。刷新应用后,语言已更改。因此,在更改系统语言时,我需要更改应用程序语言而无需刷新。

import i18n from 'i18next';
import { reactI18nextModule } from 'react-i18next';
import locale from 'react-native-locale-detector';
import { AsyncStorage } from 'react-native';
import DeviceInfo from 'react-native-device-info';
import de from './de.json';
import en from './en.json';
import ar from './ar.json';
const STORAGE_KEY = '@APP:languageCode';
const languageDetector = {
  init: Function.prototype,
  type: 'languageDetector',
  async: true,
  detect: async (callback) => {
    const savedDataJSON = await AsyncStorage.getItem(STORAGE_KEY);
    const lng = (savedDataJSON) ? savedDataJSON : null;
    const selectLanguage = lng || locale;
    console.log('detect - selectLanguage:', selectLanguage);
    callback(selectLanguage);
  },
  cacheUserLanguage: () => { }
};

i18n
  .use(languageDetector)
  .use(reactI18nextModule)
  .init({
    fallbackLng: 'en',
    resources: { en, de, ar },
    ns: ['common'],
    defaultNS: 'common',
    debug: true,
    interpolation: {
      escapeValue: false,
    }
  });


export default i18n;

0 个答案:

没有答案