Once I enter in the following code I receive back two different URLs for two different images within the /Images folder. I wish to display both of these but can't seem to do so in a flatlist. Here is my code for retrieval and any suggestions for displaying images from firebase storage are welcome.

    async function fetchPictures() {
    await firebase.storage().ref().child('Images').list().then(result => {
        // Loop over each item
        result.items.forEach(pics => {
            firebase.storage().ref().child(pics.fullPath).getDownloadURL().then((url) => {
                setUrl(url);
            })
        });
    })
}

CodePudding user response：

Change your state to an imageUrl array instead of a single url:

const [images, setImages] = useState([]);

Then push onto that array when you get your results:

await firebase.storage().ref().child('Images').list().then(result => {
        // Loop over each item
        const imageUrls = [];
        result.items.forEach(pics => {
            firebase.storage().ref().child(pics.fullPath).getDownloadURL().then((url) => {
                imageUrls.push(url);
            })
        });
        setImages(imageUrls);
    });

Should then be trivial to display them in your FlatList (using images state).