CODEWITHSUNDEEP
javascriptiosreact-nativerequire
Dmitry
Dmitry

Reputation: 867

React Native: how to use require(path) with dynamic urls?

I want to use WebView to show some html content

here is an example:

return (
            <WebView
                    style={styles.container}
                    source={source}
                    scalesPageToFit={Boolean(true)}
                    onNavigationStateChange={this._onNavigationStateChange} />
    )

and for the source variable I need to have two different values:

1) for android platform I need to use something like this:

source = {uri: `file:///android_asset/contents/${languageId}text.html`}

2) for ios I need to use smth. like this:

source = require(`../srv/localization/contents/${languageId}text.html`)

For android it works well, but for ios it doesn't work. And this url works fine for iOS also

require(`../srv/localization/contents/entext.html`)

As I understand that is because of dynamic url (${languageId}text.html)

The question is how to use dynamic urls for iOS?

Upvotes: 1

Views: 3219

Answers (1)

Meysam Izadmehr
Meysam Izadmehr

Reputation: 3262

As you find out, you can't have dynamic url for require. That's because require get the source at the app start regardless it's place in the code. You shuld require all of the {languageId}text.html and pass the required variable to the source:

var language = {
   en: require(`../srv/localization/contents/entext.html`)
   ...
}

and use it as below:

source = require(language[en])

Upvotes: 6

Related Questions