在javascript循环中未定义

Question

我想输出firebase数据库中所有产品的列表，为此我执行以下循环:

db.collection("products").get().then((querySnapshot) => {
querySnapshot.forEach((doc) => {
var wrapper = document.getElementById("wrapper");
var myHTML = '<h6 id="name">' + doc.name +' </h6>';
wrapper.innerHTML = myHTML
console.log(doc.id, " => ", doc.data());
});
});

然而，在我的html是打印undefined。谁能指出问题所在，我该如何解决?附言:我是网络新手

Answer 1

name属性存在于DocumentData中，而不存在于DocumentSnapshot本身。试试这个:

// no data in original code
// var myHTML = '<h6 id="name">' + doc.name +' </h6>';

var myHTML = '<h6 id="name">' + doc.data().name +' </h6>';
// add data()                       ^^^^

Answer 2

Try This，

db.collection("products").get().then((querySnapshot) => {

let customHtml = ``;
querySnapshot.forEach((doc) => {
customHtml += '<h6 id="name">' + doc.name +' </h6>';
});
document.getElementById("wrapper").innerHTML = customHtml;
});