react-native-i18n 语言切换工具

yarn add react-native-i18n

Android

在./android/settings.gradle文件中添加下列代码:

include ':app', ':react-native-i18n'
project(':react-native-i18n').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-i18n/android')

在./android/app/build.gradle文件中加入下列代码:

dependencies {
    // ...
    compile project(':react-native-i18n')
}

在./android/app/src/main/java/your/bundle/MainApplication.java中添加如下代码：:

import com.AlexanderZaytsev.RNI18n.RNI18nPackage; // <-- Add to ReactNativeI18n to the imports

// ...

@Override
protected List<ReactPackage> getPackages() {
    return Arrays.<ReactPackage>asList(
        new MainReactPackage(),
        // ...
        new RNI18nPackage(), // <-- Add it to the packages list
    );
}

// ...

使用

创建一个关于语言的文件夹
创建多语言的js配置文件

我这里写了两个 一个中文，一个英文

en.js:

/**
 * Created by 卓原 on 2018/6/28.
 *
 */
export default {
    home: {
        greeting: 'Greeting in en',
        tab_home: 'Home',
        tab_donate: 'Donate',
        tab_demo: 'Demo',
        language: 'language',
        live_demo: 'Live Demo',
        buy_me_coffee: 'Buy me a coffee',
        gitee: 'Gitee',
        star_me: 'Star me',
        donate: 'donate',
        exit: 'exit?',
    },
    greeting:'English'
}

zh.js

/**
 * Created by 卓原 on 2018/6/28.
 *
 */
export default {
    home: {
        greeting: 'Greeting in zh',
        tab_home: '首页',
        tab_donate: '捐赠',
        tab_demo: '例子',
        language: '语言',
        live_demo: '例子',
        buy_me_coffee: '请我一杯coffee',
        gitee: 'Gitee',
        star_me: '关注我',
        donate: '贡献',
        exit: '是否退出?',
    },
    greeting:'中文'
}

然后index.js：

/**
 * Created by 卓原 on 2018/6/28.
 *
 */
import I18n from 'react-native-i18n';

import en from './en';
import zh from './zh';

// Enable fallbacks if you want `en-US` and `en-GB` to fallback to `en`
I18n.fallbacks = true;

//设置默认语言
I18n.defaultLocale = 'zh';

I18n.translations = {
    en,
    zh
};

export default I18n;

在项目中使用：

import I18n from '../language';
...

<Text>{I18n.t('home.exit')}</Text>
...

const I18nHome = I18n.t('home');
<Text>{I18nHome.exit}</Text>

这里会根据系统的语言来自动选择对应的语言文件，如果没有则使用默认的语言，我上面设置的默认语言问zh，即中文。

您可以使用getLanguages方法获取用户首选的语言环境

import { getLanguages } from 'react-native-i18n';

getLanguages().then(languages => {
  console.log(languages); // ['en-US', 'en']
});

请注意，js的名字最好都是语言的缩写，下面提供参考：

想获取更多相关使用方式 请点击