我有一个chrome扩展，它将数据存储在Firestore中，并将数据填充到前端。我总是需要刷新页面才能看到新添加的数据，这不是一个用户友好的体验。我如何更新UI以显示新更新的数据而不必刷新页面？
到目前为止，我已经尝试使用useEffect来获取数据，在它里面，我使用了一个函数，该函数从缓存在chrome本地存储中的Firestore获取数据。
这是我的代码

const getFolderData = () => {
     getDataFromChrome("docId").then((res: any) => {
         setDocId(res.docId);
      });

    getDataFromChrome("content").then((res: any) => {
      //console.log("getting in mainfolder",res);
      // for (const item of res.content) {
      //   if (item.type.toLowerCase() === "subfolder") {
      //     // console.log(item)
      //     getSubFolder(item.id);
      //   }
      // }
      for (const item of res.content) {
        setTiersContent((pre: any) => [...pre, item]);
      }
    });
  };

  useEffect(() => {
    getFolderData();

  }, []);

我也收到这个错误。我也在使用chrome扩展API与后台脚本通信。这可能与问题有关

Uncaught (in promise) Error: A listener indicated an asynchronous response by returning true, but the message channel closed before a response was received