使用 i18next 的 React-native 语言和说明

问题描述 投票:0回答:0

我是 react-native 的新手,所以在问我的问题之前,我想知道更改整个应用程序的语言和方向的最佳选择!我会很感激🙏

现在我试了一下,我这样设置 i18n 文件:

 `    
 const ns = Object.keys(Object.values(resources)[0]);
 export const defaultNS = ns[0];

 AsyncStorage.getItem('language', (error, language) => {
   i18n.use(initReactI18next).init({
     ns,
     defaultNS,
     resources: {
       ...Object.entries(resources).reduce(
         (acc, [key, value]) => ({
           ...acc,
         [key]: value,
       }),
       {},
      ),
     },
     lng: language || 'ar', // my conception is to change the lang whenever the user change it
     fallbackLng: 'ar',
     interpolation: {
       escapeValue: false,
     },
     compatibilityJSON: 'v3',
   });
 });

`

这里是用户更改语言的功能

`    
//! on press to select language
const handleLanguageSelect = (key: LangProps) => {
  setLanguage(key);
  AsyncStorage.setItem('language', key as string);
  if (key && i18n) {
    i18n.changeLanguage(key).then(() => {
      i18n.language === 'ar'
        ? I18nManager.forceRTL(true)
        : I18nManager.forceRTL(false);
      RNRestart.Restart();
    });
  }
};
`

正如我所说,每当用户更改语言时,我都会尝试更改 lng 属性,但我收到错误消息,因为 i18n 无法在第一次渲染时加载,因为我正在使用 promise 从 asyncStorage 获取数据...

我希望得到关于如何在我的 React 应用程序中添加语言和方向支持的明确答案

android ios react-native i18next asyncstorage
© www.soinside.com 2019 - 2024. All rights reserved.