如何使用“.each”方法生成的数据结果？

Question

我使用 Dexie.js（一个 IndexedDb 包装器）。

我试过像这样生成 HTML：

function getList(where){
    var html = [];
    if($.isEmptyObject(where)) return;
    db.modules.where(where).each(function(item){
        html.push('<div class="module-item">');
        html.push('<div class="module-item-pic"><img src="' + item.modu_pic + '" class="img-fluid" /></div>');
        ....
        html.push('</div>')
        html.push('</div>');
    })
    console.log(html.join(''));
}

但是上面的代码没有任何输出。

但是，当我将 console.log(html.join('')) 放入 .each:

的回调中时，我得到了一个输出

function getList(where){
    var html = [];
    if($.isEmptyObject(where)) return;
    db.modules.where(where).each(function(item){
        html.push('<div class="module-item">');
        html.push('<div class="module-item-pic"><img src="' + item.modu_pic + '" class="img-fluid" /></div>');
        ....
        html.push('</div>')
        html.push('</div>');
console.log(html.join(''));
    })

}

为什么我的第一个代码片段没有显示任何输出？

Answer 1

请记住，Dexie 操作通常是异步的。问题是您的第一个代码片段 console.log(html.join('')) 在任何异步操作完成之前立即 执行。

您需要使用 .each 返回的承诺等待所有迭代完成后再尝试输出到控制台：

function getList(where){
    var html = [];
    if($.isEmptyObject(where)) return;
    db.modules.where(where).each(function(item){
        html.push('<div class="module-item">');
        html.push('<div class="module-item-pic"><img src="' + item.modu_pic + '" class="img-fluid" /></div>');
        ....
        html.push('</div>')
        html.push('</div>');
    }).then(function () {
      console.log(html.join(''));
    });
}

如何使用“.each”方法生成的数据结果？

How can I use the results of data produced by the ".each" method?

scope

dexie