React Native - Image Require Module using Dynamic Names

Question

I\'m currently building a test app using React Native. The Image module, thus far has been working fine.

For example, if I had an image named avatar, th

Answer 1

This is covered in the documentation under the section "Static Resources":

The only allowed way to refer to an image in the bundle is to literally write require('image!name-of-the-asset') in the source.

// GOOD


// BAD
var icon = this.props.active ? 'my-icon-active' : 'my-icon-inactive';


// GOOD
var icon = this.props.active ? require('image!my-icon-active') : require('image!my-icon-inactive');

However you also need to remember to add your images to an xcassets bundle in your app in Xcode, though it seems from your comment you've done that already.

http://facebook.github.io/react-native/docs/image.html#adding-static-resources-to-your-app-using-images-xcassets