How to display an array of images from the firestore database in react native?

hello how to show an array of images from the firestore database in react native? i tried this but no images are showing

{this.props.user.map((images)=>{
return (
  <View>
    <Image style={ {width: 350, height: 300}} source={{uri: images.photos}} />
  </View>
);
})}

i am getting this warning at the bottom of the screen in yellow

''Warning: Failed prop type: Invalid prop 'source' supplied to 'ForwardRef(image)' ''

Hi @emmanuel_1234 What is image.photos ? is it a valid uri ?

yes here it is

Object {

“photos”: Array [
https://picsum.photos/id/1003/1181/1772”,
https://picsum.photos/id/1001/5616/3744”,
],
}

You’re supplying an array for the source, but the uri prop need un url string

It’s better to loop throught your the photos array as well to dispay the picture.

{this.props.user.map((images)=>
  images.photos.map(photo =>
    return (
      <View>
        <Image style={ {width: 350, height: 300}} source={{uri: photo}} />
      </View>
   );
)
)}
1 Like

This topic was automatically closed 15 days after the last reply. New replies are no longer allowed.