Image doesn't appear in the view in react-native app

Question

I have creacte one react-native project and under this folder I created one other floder witch contain one image. I want display this image, so I used the image view, as you see below

`<Image source = {{ url:'D:\PROJET_TRAQUEUR\React_learn\myfirstreactapp\node_modules\image\photo.jpg' }} style = {{width:200, height: 200}}

/>`

You can also see one imag by clicing the following link , that shows all My code and their result.

But when i ran it, the image not appeared. What is wrong?

Thanks for your helps!

Jitendrasinh Zala · Accepted Answer · 2022-04-28 10:17:30Z

If you use any image in a local then simple pass in require('//path')

source={require('./assets/icons/abc.png')}

or using url you need to pass uri

source={{uri: 'https://reactnative.dev/img/tiny_logo.png'}}

also, One more thing if you use a local image then your image should be in your project root folder

alvAro365 · Accepted Answer · 2022-04-28 09:55:39Z

As the image is a static resource use require instead of url like this:

<Image source={require('D:\PROJET_TRAQUEUR\React_learn\myfirstreactapp\node_modules\image\photo.jpg')} style={{width:200, height: 200}} />

Ashish Sahu · Accepted Answer · 2022-04-28 09:56:59Z

If you are using local Image then in the place url we need to pass require. For example please check below code:

<Image source={require('./assets/icons/abc.png')} style={{ height: 200 width: 200 }} />

Collectives™ on Stack Overflow

Image doesn't appear in the view in react-native app

3 Answers 3

Comments

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Related