Skip to content

Instantly share code, notes, and snippets.

@rgazeredo
Created October 16, 2018 20:44
Show Gist options
  • Save rgazeredo/e0da97c9f248f165deadc43e7d94589c to your computer and use it in GitHub Desktop.
Save rgazeredo/e0da97c9f248f165deadc43e7d94589c to your computer and use it in GitHub Desktop.
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
}
});
@MrEdinLaw
Copy link

Thank you very much, this saved me!

@meabed
Copy link

meabed commented Jun 27, 2019

react-native-languages is deprecated ❌

import RNLanguages from 'react-native-languages';

use react-native-localize instead ✅

import * as RNLocalize from 'react-native-localize';

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment