React Native Firebase 尝试显示来自 Firebase 存储的图像

Question

输入以下代码后，我会收到 /Images 文件夹中两个不同图像的两个不同 URL。我希望同时显示这两个，但似乎无法在平面列表中显示。这是我的检索代码，欢迎任何有关显示来自 firebase 存储的图像的建议。

    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);
            })
        });
    })
}

Answer 1

将您的状态更改为 imageUrl 数组而不是单个 url:

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

然后在得到结果后推送到该数组：

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);
    });

在 FlatList 中显示它们应该很简单（使用 images 状态）。

React Native Firebase 尝试显示来自 Firebase 存储的图像

React Native Firebase trying to show images from Firebase Storage

storage

firebase

reactjs

expo

react-native-flatlist