javascript - 使用 FireStore 时 For 循环仅进行最后一次迭代

Question

我正在尝试比较 Firebase/Firestore 数据库中的值，并且我正在根据值是否为真更改 div 边框样式。 For循环每次都会遍历，但只保留最后一次。所以我猜它是在循环中重写的，但我不明白怎么做？

// HANDLES THE FRONTEND TOGGLE/COLOR CHANGE OF SKILLS ON THE FRONTEND
for (var i = 0; i < skills.length; i++) {
    var toggledSkills = skills[i].id;
    console.log(toggledSkills);
    var query = db.collection('users').where(toggledSkills, "==", true);

    query.get().then(function(querySnapshot) {
        if (querySnapshot.empty) {
            // IF THE SKILL IS NOT LEARNED, PLAIN STYLING
            document.getElementById(toggledSkills).parentNode.style.border = "2px solid purple";
        } else {
            // IF THE SKILL IS TRUE/ALREADY LEARNED, COOL STYLING
            document.getElementById(toggledSkills).parentNode.style.border = "2px solid green";
        }
    });

}

Answer 1

如果您获取多个元素，则应该使用 forEach 遍历所有列表。

类似这样的事情:

db.collection("cities").where("capital", "==", true)
    .get()
    .then(function(querySnapshot) {
        querySnapshot.forEach(function(doc) {
            // doc.data() is never undefined for query doc snapshots
            console.log(doc.id, " => ", doc.data());
        });
    })
    .catch(function(error) {
        console.log("Error getting documents: ", error);
    });

您可以在这里找到更多信息:https://firebase.google.com/docs/firestore/query-data/get-data