Requested keys of a value that is not an object ERROR

[kesepara]

When user presses on changeLocale button this error happens and the app is crashing in Android.

https://i.stack.imgur.com/Lcicy.png

Homepage.js

constructor(props) {
    super(props);

    this.state = {
        locale: {},
        token: '',
    };

    this._changeLocale = this._changeLocale.bind(this);
}

_changeLocale() {

    if(this.state.locale.short === 'TR') {

        changeLocale({id: 2, short: 'EN'}, this.state.token);
        this.setState({
            locale: {id: 2, short: 'EN'}
        })
    } else {
        changeLocale({id: 1, short: 'TR'}, this.state.token);
        this.setState({
            locale: {id: 1, short: 'TR'}
        })
    }

}

renderContent() {

    return(
        <Container style={styles.container}>

            <HomepageHeader _changeLocale={this._changeLocale} locale={this.state.locale} />
        ...
        </Container>
}

HomepageHeader.js

render() {

    return(

        <Header style={styles.header} androidStatusBarColor={'#243f65'}>
         ...

            <Right style={styles.right}>
                <TouchableOpacity style={styles.loginButton} onPress={() => {this.props._changeLocale()}}>
                    <Text style={styles.loginText}>{this.props.locale.short}</Text>
                </TouchableOpacity>
            </Right>

        </Header>
    );
}

Function.js

export function changeLocale(locale, token) {

Variables.LOCALE.setLanguage(locale.short);

AsyncStorage.setItem('locale', JSON.stringify(locale));

return axios({
    method: 'POST',
    url: Variables.API_URL + 'auth/changeLocale',
    data: {
        locale_id: locale.id
    },
    headers: {
        'Content-Type': 'application/json',
        'Accept': 'application/json',
        'Authorization': 'Bearer ' + token
    },
});
}

Variables.js

static LOCALE = new LocalizedStrings({
    TR: {
        pages: {
            invitation: 'Davet',
            boards: 'Kurullar',
            program: 'Bilimsel Program',
            accommodation: 'Kayıt & Konaklama',
            courses: 'Kurslar',
            general: 'Genel Bilgiler',
            contact: 'İletişim',
            live: 'Canlı',
            papers: 'Bildiriler',
            search: 'Ara',
            speakers: 'Konuşmacılar',
            favorites: 'Favoriler'
        },
    },
    EN: {
        pages: {
            invitation: 'Invitation',
            boards: 'Boards',
            program: 'Scientific Program',
            accommodation: 'Registration & Accommodation',
            courses: 'Courses',
            general: 'General Information',
            contact: 'Contact',
            live: 'Live',
            papers: 'Papers',
            search: 'Search',
            speakers: 'Speakers',
            favorites: 'Favorites'
        }
    }
});

package.json

"dependencies": {
    "axios": "^0.18.0",
    "lodash": "^4.17.11",
    "native-base": "^2.8.0",
    "react": "16.4.1",
    "react-native": "0.56.1",
     ...
    "react-native-localization": "^2.0.1",
    "react-native-vector-icons": "^5.0.0",
    "react-navigation": "^2.13.0"
  }

So basically i want to press a button to change the localization of project which is in Variables.js file.

I was able to do it my previous projects but in this, i can not manage it.

I think that the problem might have been occur because of Android API level. I just read this https://facebook.github.io/react-native/docs/improvingux#use-android-ripple

But still i have no solutions.

Any help would be appreciated. Thanks.

[m00gl3]

I'm getting the same issue with

react-native 0.57 and react-native-localization": "^2.0.1"

It's failing on new LocalizedString()

[gremech]

+1 It depends on nested objects. Works fine in debug mode react-native 0.57.2 react-native-localization 2.0.3

[wkoutre]

FWIW, I spent too long troubleshooting this only to find I:

1. was using a number and not a string for as one of my LocalizedString's key's values and
2. recently introduced an (apparently breaking) circular dependency

Only experience the error with the debugger disconnected, but this was my issue.

[EslamNasser]

Got the same problem even in debug mode:

react-native: 0.57.0
react-native-localization: 2.0.3

Anybody found a solution/workaround? @stefalda can you please help with this?

[wkoutre]

@EslamNasser Check that all of your values are of type string, string[], or { [key: string]: string }. Also check that your project doesn't have any circular imports.

[EslamNasser]

@wkoutre I have some values that are numeric, but it's only throwing the error when i'm setting the language to arabic, also it works absolutely fine if i'm in debug mode.

[wkoutre]

@EslamNasser Yes, the same was happening to me (language was Chinese, though).

Try changing the numeric values to strings, and account for that where applicable in the code referencing the LocalizedString.

Also, beware of circular imports.

[Biplovkumar]

same here with "hi" . When i setting language hindi then error came.

[Biplovkumar]

FWIW, I spent too long troubleshooting this only to find I:

1. was using a number and not a string for as one of my LocalizedString's key's values and
2. recently introduced an (apparently breaking) circular dependency

Only experience the error with the debugger disconnected, but this was my issue.

Really in debug,it is like charm.

[wmonecke]

This is so weird. It is ONLY happening on Android. On iOS it is working fine. @wkoutre I did what you said about numeric values and the app still crashes when I try to change the language. What do you mean with circular imports? Like recursive importing?

[wkoutre]

@wmonecke Yes, recursive importing is what I meant. In the console, you may see warning messages that end in Require cycles are allowed, but can result in uninitialized values. Consider refactoring to remove the need for a cycle..

If this is the case, do your best to clean them all up by refactoring your directory and import/require structure.

PM me if you want, and I'll try my best to help you figure it out. Since you're trying to change the language on the fly, there are many possible contributing factors at play.