我正在设计一个网页,该网页将从我的 firestore 集合中获取数据并显示每个文档及其相应的字段以下是代码:
<table class="table is-striped is-narrow is-hoverable is-fullwidth">
<thead>
<tr>
<th>Title</th>
<th>Author</th>
<th>AR Level</th>
</tr>
</thead>
<tbody id="myTable">
</tbody>
</table>
这是JS:
db.collection("books").where("ItemType", "==", "Book").where("Program", "==", "AR")
.get()
.then(
function(querySnapshot){
querySnapshot.forEach(function(doc){
dataObj = doc.data()
console.log(dataObj)
buildTable(dataObj)
function buildTable(data){
var table = document.getElementById('myTable')
for (var i = 0; i < data.length; i++){
var row = `<tr>
<td>${data[i].Title}</td>
<td>${data[i].Author}</td>
<td>${data[i].Points}</td>
</tr>`
table.innerHTML += row
}
}
})
}
)
我不明白你为什么在函数中使用 for 循环。除非一本“书籍”文档是一个项目数组,每个项目都具有标题/作者/点字段。
您基本上是在循环访问数据对象,就好像它是一个数组一样。很可能,事实并非如此。
如果我是对的,并且一个“Book”文档是包含这三个字段的对象/映射,那么您的代码应该如下所示:
db.collection("books").where("ItemType", "==", "Book").where("Program", "==", "AR")
.get()
.then(querySnapshot=>{
querySnapshot.forEach(doc=>{
let data = doc.data();
let row = `<tr>
<td>${data.Title}</td>
<td>${data.Author}</td>
<td>${data.Points}</td>
</tr>`;
let table = document.getElementById('myTable')
table.innerHTML += row
})
})
.catch(err=>{
console.log(`Error: ${err}`)
});
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)