React Native version 0.62. I am a bit noob in React Native and I am trying to set up react-native-localize as per this guide https://heartbeat.fritz.ai/how-to-use-react-native-localize-in-react-native-apps-3bb3d510f801 but when I change language and come back to my app I am struggling with this error:
Below you can see my App.js
import React, { Component } from 'react';
import { StatusBar, Text } from 'react-native';
import * as RNLocalize from 'react-native-localize'
import {Router, Scene, Tabs} from 'react-native-router-flux';
import Search from '@screens/Search';
import MyAppointments from '@screens/MyAppointments';
import MyAccount from '@screens/MyAccount';
import CustomTabBar from '@components/CustomTabBar';
import theme from '@styles/theme';
import memoize from 'lodash.memoize';
import i18n from 'i18n-js';
const translationGetters = {
en: () => require('./translations/en.json'),
it: () => require('./translations/it.json')
};
const translate = memoize(
(key, config) => i18n.t(key, config),
(key, config) => (config ? key + JSON.stringify(config) : key)
);
const setI18nConfig = () => {
const fallback = { languageTag: 'en' };
const { languageTag } =
RNLocalize.findBestAvailableLanguage(Object.keys(translationGetters)) ||
fallback;
translate.cache.clear();
i18n.translations = { [languageTag]: translationGetters[languageTag]() };
i18n.locale = languageTag;
};
export default class App extends Component {
constructor(props) {
super(props);
setI18nConfig()
}
componentDidMount() {
RNLocalize.addEventListener('change', this.handleLocalizationChange)
}
componentWillUnmount() {
RNLocalize.removeEventListener('change', this.handleLocalizationChange)
}
handleLocalizationChange = () => {
setI18nConfig()
.then(() => this.forceUpdate())
.catch(error => {
console.error(error)
})
};
render() {
return (
... render code not important for the issue
);
}
}
Many thanks to who will help me.
seti18nConfig
function doesn't return a promise for you to use a.then
on it. It is a synchronous function. You can simply write