编辑按钮没有任何作用。我怎样才能使它工作

Question

编辑按钮应该编辑表格中输入的数据，但单击后不会执行任何操作。

此代码中的所有内容均有效，但编辑按钮实际上并未对 Firestore 中的数据库进行编辑或执行任何操作。

// Edit button pressed
$(document).on('click', '.editBtn', function() {
  const id = $(this).data('id');
  const docRef = doc(db, "movie-review", id);
  docRef.get().then((doc) => {
    if (doc.exists) {
      const data = doc.data();
      $("#movieName").val(data.movie_name);
      $("#director").val(data.director);
      $("#releasedate").val(data.release_date);
      $("#movieRating").val(data.movie_rating);
      // Delete existing data
      deleteDoc(docRef).then(() => {
        console.log("Document successfully deleted!");
      }).catch((error) => {
        console.error("Error removing document: ", error);
      });
    } else {
      console.log("No such document!");
    }
  }).catch((error) => {
    console.log("Error getting document:", error);
  });
});


// Update button pressed
$("#updateButton").click(function() {
  const id = $("#editReviewId").val();
  const docRef = doc(db, "movie-review", id);
  setDoc(docRef, {
    movie_name: $("#editMovieName").val(),
    director: $("#editDirector").val(),
    release_date: $("#editReleaseDate").val(),
    movie_rating: parseInt($("#editMovieRating").val())
  }).then(() => {
    // Close the edit review modal
    $('#editReviewModal').modal('hide');
  }).catch((error) => {
    console.error("Error updating document: ", error);
  });
});

// Delete button pressed
$(document).on('click', '.deleteBtn', function() {
  const id = $(this).data('id');
  deleteDoc(doc(db, "movie-review", id)).then(() => {
    console.log("Document successfully deleted!");
  }).catch((error) => {
    console.error("Error removing document: ", error);
  });
});

Answer 1

正如 firebase 文档中提到的，我刚刚按照文档修改了该函数，并且工作正常。 https://firebase.google.com/docs/firestore/query-data/get-data 请检查名为“获取文档”的部分。您必须使用 getDoc 函数而不是“get”。

我附上修改后的版本。

$(document).on('click', '.editBtn', function () {
    const id = $(this).data('id');
    const docRef = doc(db, "movie-review", id);
    const docSnap = getDoc(docRef);
    docSnap.then((doc) => {
        if (doc.exists()) {
            const data = doc.data();
            $("#movieName").val(data.movie_name);
            $("#director").val(data.director);
            $("#releasedate").val(data.release_date);
            $("#movieRating").val(data.movie_rating);
            // Delete existing data
            deleteDoc(docRef).then(() => {
                console.log("Document successfully deleted!");
            }).catch((error) => {
                console.error("Error removing document: ", error);
            });
        } else {
            console.log("No such document!");
        }
    }).catch((error) => {
        console.log("Error getting document:", error);
    });
});