如何使用 React 和 Firebase V9 更新 function？

Question

我正在使用 firebase 的實時數據庫和 react 來創建一個 CRUD，但是更新 function 讓我很困惑，原因有兩個。

1 - 用於簡單更新一個或多個屬性的最正確方法是什么？ 有時我看到使用update() ，其他時候我看到updateDoc()其他時候我看到set() 。 作為 firebase 的初學者（我正在嘗試做的第一個應用程序），我對很多事情感到迷茫和困惑，更不用說realtime和firestore之間的區別了，我不太明白為什么一個數據庫中有兩個數據庫（？ ？？？）

2 - 我正在嘗試處理雜物，但正如我所說，我沒有讓它發揮作用。 它在控制台上沒有給出任何錯誤，我仍然收到成功消息，但數據既沒有在屏幕上也沒有在數據庫中更新，我不明白我錯了哪一部分。 有什么東西不見了？ 代碼是：

使用事務.tsx

  async function updateTransaction(transaction: Transaction) {
    await update(ref(realTimeDatabase, `transactions/${transaction.id}`), {
      transactionUpdate
    }).then(() => {
      const updatedTransaction = transactions.map((transaction) => {
        return transaction.id === transactionUpdate?.id ? transactionUpdate : transaction
      });
  
      setTransactions(updatedTransaction)
      toast.success('Atualizada com sucesso')
      console.log('Atualizada no firebase');

    }).catch((err) => {
      toast.error('Ocorreu um erro ao atualizar')
      console.log(err);
    })
  }

UpdateTransactionModal.tsx

  async function handleUpdateTransaction(event: FormEvent) {
    event.preventDefault();
    await updateTransaction({
      id,
      title,
      amount,
      category,
      type,
      createdAt: String(new Date()),
    })    
    onRequestClose()
  }

回購是： https://github.com/eltonsantos/eurorcamento

更新：

console.log("ID1: " + transactionUpdate?.id) >> undefined
console.log("ID2: " + transaction.id) >> -NJCBBEMVRMymMw-1tjI

Answer 1

我設法解決了它，我將在這里分享答案：

我的 transactionUpdate state 在這里是不必要的並且令人困惑，因為已經在 updateTransaction function 中收到了名稱為 transaction 的新交易，並且不需要 state 來檢索正在更新的交易的值。

所以為了解決這個問題，我只是稍微更改了.map()以停止使用 transactionUpdate 變量並使用由參數接收的事務。

所以我修復了它，因為有兩個名稱為事務的變量，所以我將 map 中的一個更改為“t”以不同。 它奏效了！

代碼在這里：

  async function updateTransaction(transaction: Transaction) {
    await update(ref(realTimeDatabase, `transactions/${transaction.id}`), {
      title: transaction.title,
      amount: transaction.amount,
      type: transaction.type,
      category: transaction.category
    }).then(() => {
      setTransactions(transactions.map((t) => t.id === transaction.id ? transaction : t ))
      toast.success('Atualizada com sucesso')
      console.log('Atualizada no firebase');

    }).catch((err) => {
      toast.error('Ocorreu um erro ao atualizar')
      console.log(err);
    })
  }