我如何在整个应用程序中运行一个功能，当该功能完成后它会停止？

Question

我怎样才能在整个应用程序中运行一个功能，当该功能完成后它就会停止？我正在我的应用程序中构建上传帖子功能，但在我的情况下，在 firebase 中上传图片需要 9-11 秒的时间，所以我所做的是将该图片存储在应用程序缓存中并成功添加帖子，但现在如果用户清除应用程序缓存然后缓存后图像 url 将不起作用所以我想做的是我想将该缓存图像 url 存储到 firbase url 然后将该 url 更新到数据库，并且该图像 url 将存储在应用程序缓存中直到 firbase完成它的工作，然后我清除缓存并将 firbase url 更新为 db

那么在哪里运行该功能，以便我可以在每个组件的整个应用程序中运行？

该功能：

const PostImageHandler = useCallback(async () => {
        if (!postImage.cancelled) {
            const response = await fetch(postImage);
            const blob = await response.blob();
            const filename = postImage.substring(postImage.lastIndexOf('/') + 1);
            const ref = firebase.storage().ref().child(filename);
            const snapshot = await ref.put(blob);
            const url = await snapshot.ref.getDownloadURL();
            setPost(url)
            console.log(url)
            firebase.clearCache()
        }
    }, [postImage])

Answer 1

您可以创建一个服务，其中包含将图像上传到 Firebase、更新数据库和清除缓存的功能。将此服务注入任何需要使用它的组件并从那里调用该函数。您还可以在服务中使用 Subject 来通知组件有关函数的状态，并在函数运行时显示加载微调器。