第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全,請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問題,去搜搜看,總會(huì)有你想問的

如何將子集合中的數(shù)據(jù)分配給它的集合并呈現(xiàn)新對(duì)象?

如何將子集合中的數(shù)據(jù)分配給它的集合并呈現(xiàn)新對(duì)象?

心有法竹 2023-04-01 15:54:04
我陷入了以下困境,經(jīng)過大量研究后沒有找到任何答案。我想做的是:簡單地讓用戶通過 react 和 useeffect-hook 從 firestore-DB 中包含他們的圖像并顯示它們。數(shù)據(jù)庫結(jié)構(gòu)如下所示: https ://i.stack.imgur.com/sDcrv.png所以圖片是用戶集合的子集合。從用戶集合中獲取用戶后,我正在執(zhí)行第二個(gè)請(qǐng)求,使用Object.assign將用戶圖像添加到該特定用戶。在每次 forEach 運(yùn)行用戶集合后,我將用戶數(shù)組設(shè)置為setUsers((oldUsers) => [...oldUsers, currentUser]);. 記錄用戶數(shù)組顯示使用包括他們的圖像。問題:嘗試渲染圖像時(shí),它們總是未定義。解決方法:按下一個(gè)按鈕調(diào)用一個(gè)函數(shù)來重新設(shè)置用戶:const reRenderUsers = () => {    if (userDataLoaded === false) {      setUserDataLoaded(true);    }    const copy = [...users];    setUsers(copy);  };^ 這解決了問題和顯示的所有圖像。問題:是否有可能無需“重新渲染”用戶即可立即顯示圖像?例如,我是否使用了 useEffect-hook 錯(cuò)誤?我感謝任何建議。提前謝謝了!
查看完整描述

1 回答

?
胡說叔叔

TA貢獻(xiàn)1804條經(jīng)驗(yàn) 獲得超8個(gè)贊

這是因?yàn)槟?firebase 響應(yīng)完成回調(diào)鏈之前調(diào)用了 setUser。您需要在成功回調(diào)內(nèi)的循環(huán)完成后立即更新狀態(tài)。我已經(jīng)更新了 useEffect 以在回調(diào)后立即更新它


useEffect(() => {

  const unsubscribe = database.collection("users").onSnapshot((snapshot) => {

    snapshot.forEach((doc) => {

      const currentUser = {

        id: doc.id,

        ...doc.data(),

      };

      database

        .collection("users")

        .doc(currentUser.id)

        .collection("pictures")

        .get()

        .then((response) => {

          const fetchedPictures = [];

          response.forEach((document) => {

            const fetchedPicture = {

              id: document.id,

              ...document.data(),

            };

            fetchedPictures.push(fetchedPicture);

          });

          currentUser.pictures = fetchedPictures;

          setUsers((oldUsers) => [...oldUsers, currentUser]);

        })

        .catch((error) => {

          console.log(error);

        });

      //dont need this here

      //setUsers((oldUsers) => [...oldUsers, currentUser]);

    });

  });


  return () => {

    unsubscribe();

  };

}, []);

祝你好運(yùn)


查看完整回答
反對(duì) 回復(fù) 2023-04-01
  • 1 回答
  • 0 關(guān)注
  • 115 瀏覽
慕課專欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)