En la aplicación, el usuario puede crear su propio banco. Él ingresa los datos apropiados en los campos y cuando hace clic en el botón "Agregar", los campos deben escribirse en la base de datos. Pero ahora, cuando hago clic, aparece un error: FirebaseError no detectado: función addDoc() llamada con datos no válidos. Valor de campo no admitido: un objeto HTMLInputElement personalizado (que se encuentra en el campo bankName en el documento bank-items/AMgVThS6caX9BJuCeezJ) ¿Cómo se puede solucionar?
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>Debe pasar el valor de los campos de entrada a Firestore (que sería una cadena/número) en lugar del elemento HTML en sí. Pruebe getElementById devolver un objeto Element que no sea un tipo de datos válido de Firestore. Intente refactorizar el código como se muestra a continuación:
const bankName = document.getElementById("bank-name").value; // add .value for every element