擴展運算符僅添加 for 循環中的最后一個值

Question

我正在嘗試顯示 firebase 集合中每個文檔中出生的值的所有值。 我的代碼如下。

  const [bdays, setBdays] = useState([]);

  const refresh = () => {
    db.collection("posts")
      .orderBy("born")
      .onSnapshot((ss) => {
        ss.forEach((doc) => {
          setBdays([...bdays, doc.data().born]);
        });
      });
    console.log(bdays);
  };

console.log(bdays)的結果是[2005,2005,2005,2005]但應該是[1998, 1999, 2001, 2005]有人知道為什么會這樣嗎？

Answer 1

正如其中一條評論所指出的，設置 state 是一個異步過程。 您可以通過使用像這樣的局部變量來完成您想要的：

  const [bdays, setBdays] = useState([]);

  const refresh = () => {
    const updatedBdays = bdays;
    db.collection("posts")
      .orderBy("born")
      .onSnapshot((ss) => {
        ss.forEach((doc) => {
          updatedBdays.push(doc.data().born);
        });
      });
    setBdays(updatedBdays);
    console.log(bdays);
  };