Question

我有一个本机应用程序，默认语言是英语。我有一个个人资料页面，用户可以在其中将语言从英语更改为另一种语言。当用户保存语言更改时，包括标题，抽屉导航名称在内的语言都应更改为用户选择的语言。我们如何在本机中实现此功能？

Answer 1

您可以使用此套件：https://github.com/AlexanderZaytsev/react-native-i18n

安装完成后，您只需要定义语言环境文件，例如：

// src/i18n/locales/en.js
export default {  
  greeting: 'Hi!'
};

// src/i18n/locales/es.js
export default {  
  greeting: 'Hola!'
};

// src/i18n/locales/jp.js
export default {  
  greeting: 'Konichiwa!'
};

然后导入这些文件并设置i18n支持的配置，如下所示：

// src/i18n/index.js
import I18n from 'react-native-i18n';
import en from './locales/en';
import es from './locales/es'; 
import jp from './locales/jp';  

I18n.fallbacks = true;

I18n.translations = {
  en,
  es,
  jp,
};

export default I18n;

最后在你的组件中使用它：

import I18n from 'src/i18n';

class Demo extends React.Component {
  render () {
    return (
      <Text>{I18n.t('greeting')}</Text>
    )
  }
}

默认情况下，它将使用设备的区域设置，但是如果要覆盖它。例如，当用户的设备具有西班牙语语言环境但希望使用日语时，您可以执行以下操作：

I18n.locale = 'jp';

每当您致电I18n.t('greeting')时，它都会呈现Konichiwa!。从现在开始，您始终需要使用I18n.t来呈现应用中的任何文字。

Answer 2

您可以从以下链接安装i18n软件包：https://github.com/AlexanderZaytsev/react-native-i18n

现在，您需要在每个部分进行语言更改，只需将I18n导入js文件即可：

import I18n from "react-native-i18n";

并在按下按钮时使用底部代码

I18n.locale = "en"; // Language desired

更改整个React Native App的语言

2 个答案: