javascript - 如何获取用户点击的文档的文档ID?
问题描述
JS:
function getDataOfBus() {
var dates = document.getElementById('departure-date').value.toString();
var fromd = document.getElementById('from-dest').value.toString()
var tod = document.getElementById('to-dest').value.toString()
console.log(dates + " -" + fromd + " -" + tod)
db.collection('Buses').where("DepartureDate", "==", dates).where("To", "==", tod).
where("From", "==", fromd).get().then((snapshot) => {
let html = '';
snapshot.forEach((busDatas) => {
busData = busDatas.data()
console.log(busData.id)
html += `
<div class="single-room-area d-flex align-items-center mb-50 wow fadeInUp" data-wow-delay="100ms" id="prince">
<div class="room-thumbnail">
<img src="${busData.ImageLink}" alt="">
</div>
<div class="room-content">
<h2><a href="javascript:setImage();">${busData.TourName}</h2>
<h6>${busData.From} to ${busData.To}</h6>
<h4>₹ ${busData.SeatPrice} </h4>
<div class="room-feature">
<h6>Boarding Point <span>${busData.BoardingTime}</span></h6>
<h6>Dropping Point <span>${busData.DroppingTime}</span></h6>
<h6>Seats Left <span>${busData.SeatsLeft}</span></h6>
<h6>Total Time <span>${busData.TotalTime}</span></h6>
<h6>Departure Date <span>${busData.DepartureDate}</span></h6>
</div>
</div>
</div>
`
document.getElementById('bus-container-dynamic').innerHTML = html;
}) // End foreach
}) // End then
}
function setImage() {
}
我已经执行了上面的代码来显示来自云 Firestore 的文档。但是我不知道如何获取用户单击的文档的文档 ID 并在setImage()
函数中使用该文档 ID?
解决方案
通过这样做busData = busDatas.data()
,您将data()
方法返回的对象分配给busData
变量,但该对象不包含文档 ID。
您应该使用另一个变量来保存此值或将文档 ID 分配给此busData
对象。以下(实施第二个选项)应该可以解决问题:
snapshot.forEach((busDatas) => {
var busData = busDatas.data()
busData.docId = busDatas.id
//...
<h2><a href="javascript:setImage('${busData.docId}');">${busData.TourName}</h2>
//...
});
busDatas
(带 s)是 aQueryDocumentSnapshot
并且您使用它的id
属性。
您还可以使用扩展语法,如下所示:
var busData = { docId: busDatas.id, ...busDatas.data() }
推荐阅读
- spring-boot - Spring Boot:以事务方式调用你自己的 RestController
- php - symfony dql 不通过函数之间的连接传递别名
- amazon-web-services - 亚马逊应用程序负载均衡器上托管的套接字连接的 400 错误请求
- sql - SSIS检查是否第一个月使用变量A运行,如果不使用变量B运行
- docker - Docker 登录总是使用 HTTP 而不是 HTTPS
- batch-file - VBscript HTTP Status msgbox 只弹出一次问题
- ms-access - 在 Access VBA 中连接 SQL
- css - 悬停时的 CSS 动画 - 完成后暂停
- python - 线程 ptvsd.stopping 中的 Python 3 异常(很可能在解释器关闭期间引发
- javascript - 为什么 jquery 可以在 onClick 上工作,但不能在 ontouchstart 上工作?