【ReactNative】i18n-jsを使ったローカライズ

i18n-js

ローカライズのため翻訳ファイルを作成します。

Localization - Expo Documentation

import * as Localization from 'expo-localization';
import i18n from 'i18n-js';
import en from './en.json';
import ja from './ja.json';

// 言語ごとの翻訳を定義する
i18n.translations = {
  en,
  ja,
};
// ロケールを自動で取得する場合
i18n.locale = Localization.locale;
// 定義がない言語の場合の挙動
i18n.fallbacks = true;

export default i18n;

• englishの定義

{
  "welcome": "Hello",
  "mainTab": {
    "home": "Home",
    "search": "Search",
    "take": "Take",
    "notification": "Notification",
    "me": "Me"
  }
}

• 日本語の定義

{
  "welcome": "こんにちは",
  "mainTab": {
    "home": "ホーム",
    "search": "検索",
    "take": "撮影",
    "notification": "通知",
    "me": "自分"
  }
}

• 使うとき

i18n.t('mainTab.home')

他にも

こんなんもあります。

Introduction - react-i18next documentation