React native localizations: Global variable

Question

I am new to React, and I come from the world of iOS/Android where localized strings are all defined in dedicated files. I have looked into react-native-localization and it seems like we need to define the strings object in each class and then use the values in the rendering. This seems to be quite inefficient and fragmented to me, or maybe I have misunderstood the usage. I haven't been able to find good examples of the usage of react-native-localization. I'd really appreciate some guidance.

Answer 1

We have used react-native-localization on our project and its very useful this is our usage:

.../ApplicationRoot/utils/strings.js

import LocalizedStrings from 'react-native-localization';

let Strings = new LocalizedStrings({
  ar:{
    hello:'أهلاً',
    howareyou:'كيف حالك؟'
  },
  en:{
    hello:'Hello!',
    howareyou:'How Are You?'
  }

});


module.exports = Strings;

after that we import it in any component we want to use it in:

TestComponent.js:

import Strings from './utils/strings.js'

...

<Text>Strings.hello</Text>

Answer 2

It's possible to use this react library set up localization. It also has shorthand methods. And it also supports auto language detection of the device.

UPDATE

Use this library as the above one is deprecated

https://github.com/react-native-community/react-native-localize