Question: I already extracted data from firebase and displaying them. Now i need to display images also. In firebase database i have the same structure as the image below [![enter image description here](https://i.stack.imgur.com/kDwIu.png)](https://i.stack.imgur.com/kDwIu.png)

And I have a folder under my project that contains all images with the exact same name like for an example "Carl.png"
I extracted the photo content in and combined with the rest of the path : "Myproject/img/"+photo+".png" and it's displayed correctly in the screen. **But** when i try to affect it to image i get errors. And here is the code i tried 

```
<Image style={{width: 50, height: 50}} source={{uri : (this.props.item.imageName)}}> </Image>

```

and i get this [![enter image description here](https://i.stack.imgur.com/mKrSY.png)](https://i.stack.imgur.com/mKrSY.png) and if i try to put in `<Image style={{width: 50, height: 50}} source={{ uri: <Text> this.props.item.imageName </Text> }}> </Image>` i get this 
 [![enter image description here](https://i.stack.imgur.com/FPWnL.png)](https://i.stack.imgur.com/FPWnL.png)
 and if i put this code `source={require(this.props.item.imageName)}`  here is what i get: u**nknown named module**

Answer: 
Try loading it using require because you are loading it from a local storage, so your source attribute becomes:
source={ require('./img/'+photo+'.png') }
try with 
`<Image style={{width: 50, height: 50}} source={{uri : (this.props.item.imageName)}} />`

You've got space between opening & closing tag.