useState 不會立即更新狀態 (useState is not updating state immediately)

問題描述

useState 不會立即更新狀態 (useState is not updating state immediately)

這裡 userlist 正在立即更新上述邏輯的正確代碼我正在嘗試從 firestore 獲取用戶列表，而不是遍歷該列表以從不同集合中查找用戶詳細信息

useEffect(() => {
    db.collection("following/" + Credens.uid + "/userFollowing")
      .get()
      .then((snapshot) => {
        followingList = snapshot.docs.map((value, ind) => value.data());
      })
      .then(() => {
        if (followingList.length > 0) {
          followingList.map((value, index) => {
            db.collection("Postss")
              .doc(value.useruid)
              .collection("MovieWatched")
              .get()
              .then((snaps) => {
                // let Detail = snap.data()
                let movieidList = snaps.docs.map(
                  (value) => value.data().postMovieId
                );

                if (movieidList.includes(MovieId) === true) {
                  setuserList((prev) => [...prev, value.useruid]);
                }
              });
          });
        }
      })
      .then(() => {
        console.log(userList);
        userList.map((value, index) => {
          db.collection("users")
            .doc(value)
            .get()
            .then((snapshot) => {
              setfriendsWatchedData((prev) => [
                ...prev,
                {
                  usersID: value,
                  userData: snapshot.data(),
                },
              ]);
            });
        });
      });

    // return () => {
    //     cleanup
    // }
  }, []);

參考解法

方法 1:

To be sure the state did change, you can use the useEffect() to monitor the changing of that state like:

useEffect(() => { 
  if (userList) {
  // userList.map....
  } 
}, [userList])

Additional conditions can be specified in the if statement. The hook will run whenever the state changes.

(by krishanpal Singh、Tom)

參考文件

1. useState is not updating state immediately (CC BY‑SA 2.5/3.0/4.0)