Question

我想在成功登录后使用新数据刷新indexeddb存储。数据刷新完成后，我想重定向到目标网页。我的问题是我有超过1000次调用setItem，他们没有完成。

var app = {
Login: function () {
    WebService.Login($("#username").val(), $("#password").val())
        .then(function () {
            // TODO: refresh data and then redirect...
            UpdateData().then(function() {
                window.location.href = '/Home';
            });

        })
        .catch(function (err) {
            console.log("error logging in");
        });

},
UpdateData: function () {

    return fetch('/api/Customer').then(function (response) {
        return response.json();
    })
    .then(function (data) {
        var customerStore = localforage.createInstance({ name: "customers" });
        // Refresh data
        customerStore.clear().then(function () {
            data.forEach(function (c) {
                // How do I know when all setItem calls are complete??
                customerStore.setItem(String(c.CustomerID), c);
            });
        });
    })
    .catch(function (err) {
        console.log("Data error", err);
    });
}

}

我仍然相对较新的承诺，但必须有一种方法可以将所有的setItem调用转换为Promise.all（），我可以返回。我怎么能这样做？

Answer 1

我认为你需要这样的东西：

return fetch("/api/Customer")
.then(function(response) {
    return response.json();
})
.then(function(data) {
    var customerStore = localforage.createInstance({ name: "customers" });
    // Refresh data
    return customerStore.clear().then(function() {
        return Promise.all(
            data.map(function(c) {
                return customerStore.setItem(String(c.CustomerID), c);
            })
        );
    });
})
.catch(function(err) {
    console.log("Data error", err);
});

data.map将返回一组promises，然后我们也返回聚合承诺（来自Promise.all）。

您还应该保留customerStore的引用以供日后使用。此外，如果数据量很大，您可能希望使用localForage-setItems使操作更高效（但尽量避免可能的过早优化）。

在Promise.all（）中包装localForage setItem调用

1 个答案: