You can also check our guide on implementing React Native internationalization from scratch.
We support react-native-i18n implementation for React Native localization.
We provide the localization files with the JSON Object that react-native-i18n library handles. Consult the library documentation for usage details.
Export
The export generates one file per language and a master file that sets up the react-native-i18n library.
en.js
export default {
"key": "en translation"
};ru.js
export default {
"key": "ru translation"
};i18n.js
import I18n from 'react-native-i18n;
import en from 'locale/en.js'
import ru from 'locale/ru.js'
I18n.fallbacks = true;
I18n.translation = {
en,
ru
};
export default I18n;
Import
You can edit exported files and import them again to quickly update and add new keys.
If you are carrying out an import we expect this format:
{language_iso}.js
export default {
"key": "translation",
"nested": {
"key": "translation"
}
};We also support JSON file import.
Usage
import I18n from 'i18n'
class Demo extends React.Component {
render () {
return (
<Text>{I18n.t('greeting')}</Text>
)
}
}
Placeholders
This format requires named placeholders (which are not covered by our universal placeholder system).
{
"optionOne": "Hello {{name}}",
"optionTwo": "Hello %{name}"
}I18n.t("optionOne", {name: "Joan"}); // Hello Joan
I18n.t("optionTwo", {name: "Anthony"}); // Hello Anthony
Plurals
Plurals are supported as well:
{
"inbox": {
"one": "You have one message",
"other": "You have %{count} messages"
}
}
I18n.t("inbox", {count: 1}); // You have one message
I18n.t("inbox", {count: 10}); // You have 10 messages