web-dev-qa-db-ja.com

全体の言語を変更React Native App

デフォルトの言語が英語のリアクションネイティブアプリケーションがあります。ユーザーが言語を英語から別の言語に変更できるプロファイルページがあります。ユーザーが言語の変更を保存すると、タイトル、引き出しナビゲーション名を含む言語はすべて、ユーザーが選択した言語に変更する必要があります。反応ネイティブでこの機能を実装するにはどうすればよいですか？

androidiosreact-native
12
vishnumm93

このパッケージを使用できます： 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_を使用する必要があります。

23
Crysfel

このリンクからi18nパッケージをインストールできます。 https://github.com/AlexanderZaytsev/react-native-i18n

さて、すべての部分で言語を変更する必要があるのは、単にI18nをjsファイルにインポートするだけです：

import I18n from "react-native-i18n";

onpressボタンで下のコードを使用します

I18n.locale = "en"; // Language desired
0
Morteza Farhadi