使用按钮单击事件时，Firestore 不会添加新记录（网络）

Question

我是 Firebase Firestore 的新用户。我有一个集合（“词汇”），我想添加新文档（“单词”、“含义”）。该代码有效并添加了新记录。但是当我使用相同的代码在单击按钮后执行时，它不起作用并且没有错误代码。当我在 click 函数下编写 Alert("test") 以测试是否被调用时，我看到“test”消息没有问题。我认为，它表明监听器在点击时被调用。但我认为 add() 部分没有被调用。可能的原因是什么？此代码有效：      database.collection("vocabulary").add({        word:"Book",        meaning:"xxx",      })      .then(function() {        console.log("Document successfully written!");      })      .catch(function(error) {        console.error("Error writing document: ", error);      });但相同的代码在按钮单击下不起作用：<button id="savebutton">Insert Record</button>......const save=document.querySelector("#savebutton");  save.addEventListener("click",function() {       database.collection("vocabulary").add({        word:"Book",        meaning:"xxx",      })      .then(function() {        console.log("Document successfully wriiten!");      })      .catch(function(error) {        console.error("Error writing document: ", error);      });    }); 

Answer 1

OP 通过添加以下代码解决了该问题：

x.preventDefault();

从我收集的内容来看，更新后的代码看起来像这样：

<button id="savebutton">Insert Record</button>

    ......

const save=document.querySelector("#savebutton");

  save.addEventListener("click",function(x) {

  x.preventDefault(); 

      database.collection("vocabulary").add({

        word:"Book",

        meaning:"xxx",

      })

      .then(function() {

        console.log("Document successfully wriiten!");

      })

      .catch(function(error) {

        console.error("Error writing document: ", error);

      });

    });

因此，根据公共文档，OP 阻止了“x”的默认操作，解决了这个问题。