How to load image from URL in react native

To load images in react native from URL you must specify the image width, and height. React native cannot determine the width and height from downloaded images. After specifying width, and height we can specify the URL to the image source prop. Inside this prop we will specify a uri which holds our image URL.

<Image
          style={{width: '100%', height: '50%'}}
          source={{uri:'https://engineering.fb.com/wp-content/uploads/2016/04/yearinreview.jpg'}}
      />

Now you have learned how to fetch images from URL in react native. This code is easy to write, and runs asynchronously, and caches the image for subsequent reloads thus this code is very efficient, and performs well in enterprise, and small applications.

Thanks for your support. If you want to support us more we now sell coding merchandise