向数据库添加数据时发生错误

Question

在应用程序中，用户可以创建自己的银行。他将适当的数据输入到字段中，当您单击“添加”按钮时，应该将字段写入数据库。但是现在，当我单击时，我得到了一个错误- Uncaught :函数addDoc()调用无效的数据。不支持的字段值:自定义的HTMLInputElement对象(在document中的字段bankName中找到-items/AMgVThS6caX9BJuCeezJ)如何解决？

​

const addBankButton = document.getElementById("add-bank");

const addBankFunc = () => {
  addBankButton.addEventListener("click", (event) => {
    event.preventDefault();
    const bankName = document.getElementById("bank-name");
    const interestRate = document.getElementById("interest-rate");
    const maximumLoan = document.getElementById("maximum-loan");
    const minimumDownPayment = document.getElementById("minimum-down-payment");
    const loanTerm = document.getElementById("loan-term");

    db.collection("bank-items").add({
      bankName: bankName,
      interestRate: interestRate,
      maximumLoan: maximumLoan,
      minimumDownPayment: minimumDownPayment,
      loanTerm: loanTerm,
    });
  });
};

addBankFunc();

   <form>
                        <input id="bank-name" type="text" placeholder="Bank name" />
                        <input id="interest-rate" type="text" placeholder="Interest rate" />
                        <input id="maximum-loan" type="text" placeholder="Maximum loan" />
                        <input id="minimum-down-payment" type="text" placeholder="Minimum down payment" />
                        <input id="loan-term" type="text" placeholder="Loan term" />
                        <button id="add-bank">Add bank</button>
                    </form>

​

Answer 1

您应该将输入字段的值传递给Firestore (即字符串/数字)，而不是HTML元素本身。尝试getElementById返回一个非有效的Firestore 数据类型的元素对象。尝试重构代码，如下所示：

const bankName = document.getElementById("bank-name").value;
// add .value for every element