首页 > 解决方案 > 调用 Firestore 存储导致应用停止

问题描述

我认为在我的代码中,我以某种方式遍历图像,但我的 console.log 确实很疯狂。我每个文件夹中只有 3 张图片。一个叫back,另一个叫front。我怎样才能让它显示所有图像而不会导致应用程序停止爬行。同样,每个文件夹中只有 3 张图像。

为了简洁起见,我只发布其中一个。

   const [frontImage, setFrontImage] = useState();


    const getFrontImage = async () => {
        var user = firebase.auth().currentUser.email;

// like this right here gets put out almost 50 times
        console.log(user + "this is name");
        const imageRefs = await firebase.storage().ref().child(user + '/FrontPic/').listAll();
        const urls = await Promise.all(imageRefs.items.map((ref) => ref.getDownloadURL()));
        setFrontImage(urls);
    }


    useEffect(() => {
        getFrontImage();
    });

稍后在这里调用图像

              <View style={styles.DisplayImageWith}> 
                    {frontImage && frontImage.map(url => (
                    <View style={{ justifyContent: 'center' }} key={url}>
                        <Image source={{ uri: url }} style={{ width: 150, height: 150 }} />
                    </View>
                    ))}
                </View>

标签: javascriptreactjsfirebasereact-nativefirebase-storage

解决方案


每次setFrontImage调用getFrontImage都会导致另一个 redner,从而导致无限循环。

如果您只想运行getFrontImage 一次,请将一个空数组传递给 useEffect ,如下所示:useEffect(cb, [])


推荐阅读