App.js

import React, { Component } from 'react';
import { StyleSheet, Text, View, Button } from 'react-native';
import RNLanguages from 'react-native-languages';
import i18n from 'i18n-js';

import en from './translations/en.json';
import fr from './translations/fr.json';
import de from './translations/de.json';

type Props = {};
export default class App extends Component<Props> {
    state = {
        currentLanguage: RNLanguages.language
    };

    _changeLanguage = (language) => {
        this.setState({ currentLanguage: language });
    };

    render() {
        i18n.locale = this.state.currentLanguage;
        i18n.fallbacks = true;
        i18n.translations = { en, fr, de };

        return (
            <View style={styles.container}>
                <Text>{i18n.t('title')}</Text>
                <Text>{i18n.t('current', { language: i18n.currentLocale() })}</Text>
                <Button title="en" onPress={() => this._changeLanguage('en')} />
                <Button title="fr" onPress={() => this._changeLanguage('fr')} />
                <Button title="de" onPress={() => this._changeLanguage('de')} />
            </View>
        );
    }
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        justifyContent: 'center',
        alignItems: 'center',
        backgroundColor: '#F5FCFF'
    },
    welcome: {
        fontSize: 20,
        textAlign: 'center',
        margin: 10
    },
    instructions: {
        textAlign: 'center',
        color: '#333333',
        marginBottom: 5
    }
});