Change language based on user selection

Please provide the following:

  1. SDK Version: 38
  2. Platforms: Android/iOS

I’m trying to make a dual language app that allows users to select the language they’re after, but when selecting, it doesn’t change despite i18n.currentLocale() showing the correct selected language. The language will change if I save something on VS code and fast refresh is on.

Below is the code I have for it. Built on expo with typescript.

This is the i18n config

import i18n from 'i18n-js';
import AsyncStorage from '@react-native-community/async-storage'

import en from './en.json'
import zh from './zh.json'

i18n.translations = {
  en,
  zh
}

async function getLanguage() {
  const choice = await AsyncStorage.getItem('setLanguage')
  i18n.locale = choice
  i18n.fallbacks = true

  console.log(i18n.currentLocale())
}

getLanguage()

export function t(name: string) {
  return i18n.t(name)
}

Language selector

export default function LanguageChange() {

    const onPress = async (language: string) => {
        await AsyncStorage.setItem('setLanguage', language).then(()=>{});
        Updates.reload();
    }
  
  return (
      <View style={styles.selectLanguageContainer}>
          <TouchableOpacity onPress={() => onPress("en")}>
              <Text>English</Text>
          </TouchableOpacity>
          <TouchableOpacity onPress={() => onPress('zh')}>
              <Text>Chinese</Text>
          </TouchableOpacity>
      </View>
  );
}

I’m using GitHub - xcarpentier/ex-react-native-i18n: 💱 ex-react-native-i18n for Expo (despite not updated since a few months).
In my case, there is no need for Updates.reload().

1 Like

Thanks for replying, however, nothing seems to happen when there’s no Updates.reload()
The value is stored on asyncStorage but that’s it

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.