如何等待 QueryDocumentSnapshot.docs.forEach 结束返回答案

【问题标题】：How to wait a QueryDocumentSnapshot.docs.forEach ends to return如何等待 QueryDocumentSnapshot.docs.forEach 结束返回
【发布时间】：2020-03-23 02:18:07
【问题描述】：

我正在使用 Firestore 从集合中获取所有文档。我想等待所有文档从数据库返回以返回一个函数。此返回必须是从集合中获取的文档数组。目前我的控制台只打印一个Promise 变量。

var getUsersSnapshot = async function() {
        var db = firebase.firestore()
        const usersSnapshot = await firebase
            .firestore()
            .collection("users")
            .get();
        var users = []
        await usersSnapshot.docs.forEach(element => {
            users.push(element.data())            
        });
        return users
}

var getMonthlyByUserId = function () {
    var users = getUsersSnapshot()
    console.log(users)
    return new Promise((resolve, reject) => {
        resolve()
    })
}

控制台上写的值是：

在控制台上我可以看到 Promise，但我期望值数组。

【问题讨论】：

标签： javascript firebase promise google-cloud-firestore async-await

【解决方案1】：

由于getUsersSnapshot是async函数，调用时需要使用await。

var getMonthlyByUserId = async function () {
    var users = await getUsersSnapshot()
    console.log(users)
    return users;
}

你所做的带有Promise 的整个构造似乎没有必要，因为返回值已经被承诺了。

您的getUsersSnapshot 对我来说看起来很不寻常。我通常希望看到这样写：

var getUsersSnapshot = async function() {
    const usersSnapshot = await firebase
        .firestore()
        .collection("users")
        .get();
    var users = usersSnapshot.docs.map(element => element.data());
    return users
}

【讨论】：

我认为在您的示例代码中，您应该使用 map 分配给用户，而不是 forEach；即return usersSnapshot.docs.map(({data}) => data)。 forEach 实际上会返回 undefined no？
好收获！我忘记更改方法名称，但确实更改了它的主体。我更新了答案。
@Frank，谢谢你的好回答。这段代码是watch: { immediate: true, handler() { // Service.getMonthlyByUserId() } }钩子上的Vue组件内部使用的模块（服务）.js的一部分，因为我在getMonthlyByUserId()上使用async，所以不会在Vue组件上调用此方法。我还不知道原因。

【解决方案2】：

您可以使用then() 从Promise 中获取值：

var getMonthlyByUserId = function () {
    getUsersSnapshot().then((values) =>{
   console.log(values);
 });    
}

【讨论】：