2

I tried to create a picker that is used to change language. But some texts remain untranslated even if user selects different language. i tried

import * as RNLocalize from 'react-native-localize';
import I18n from 'i18n-js';
import memoize from 'lodash.memoize'; 

import en from './en';
import am from './am';
import or from './or';
import tg from './tg';


const locales = RNLocalize.getLocales();
if (Array.isArray(locales)) {
  I18n.locale = locales[0].languageTag;
}

I18n.translations = {
  default: en,
  'en-US': en,
  en,
  am,
  or,
  tg,

};

I18n.fallbacks = true;
export default I18n;

the Code I use to switch language is

onChangeLanguage(languageSelected){
  this.setState({
    languageSelected
  })
  I18n.locale = languageSelected 
}

and the react native picker is:

<Picker
  mode="dropdown"
  iosHeader={''} 
  style={{ width: width,height:80,}}
  selectedValue={this.props.language}
  onValueChange={this.props.onChangeLanguage.bind(this)}
>
  {listLanguage.map((languageItem, i) => {
      return <Picker.Item key={i} value={languageItem.key} label= {languageItem.label} />
  })}
</Picker>

Does any one show me how to Restart app when language is changed(selected)? Thanks

RobC
  • 22,977
  • 20
  • 73
  • 80
melaku
  • 89
  • 2
  • 11
  • I have an idea, you could use [Asyncstorage](https://github.com/react-native-community/async-storage) to store the `locales[0].languageTag` and compare every time if it different what you get from storage, and then store the new one, then [restart app?](https://stackoverflow.com/questions/37489946/programmatically-restart-a-react-native-app) – 高鵬翔 May 07 '20 at 09:15
  • Can you post the code that you use to switch between lanugages? – nipuna-g May 07 '20 at 09:28
  • @ nipuna777 here is the code first this.state {languageSelected:en} onChangeLanguage(languageSelected){ this.setState({ languageSelected }) I18n.locale = languageSelected } – melaku May 07 '20 at 09:35
  • How Do i use AsyncStorage i this senario and restart app @高鵬翔 – melaku May 07 '20 at 09:38
  • I have seen in your code you already using react-native-restart, Is it making some problem? – Waheed Akhtar May 07 '20 at 09:47
  • @WaheedAkhtar i only imported react-native-restart , not used yet – melaku May 07 '20 at 09:49
  • @高鵬翔 Thanks for your answer. I don't know how to integrate what you have said in to the code. – melaku May 08 '20 at 15:23

1 Answers1

0

There is no need to restart your app after language change. In React, the app re-renders if it is dependant on state or props changes. You can check my answer here: React Native, how to update view after language change

Raphael Pinel
  • 2,352
  • 24
  • 26