顺序解决承诺会导致错误

时间:2019-05-02 13:16:32

标签: javascript arrays vue.js promise sequence

我一直在尝试遍历ID数组,并将其传递给调用API的函数(this.handleTransfer)。我希望仅在收到前一迭代的响应时才启动下一个迭代。 我决定在Google上如何使用Promise做到这一点。 但是当我实现上线的内容时,以下错误会在第一次迭代后发生:

TypeError: e(...).then is not a function.

原因是错误的是该代码块

return e().then(Array.prototype.concat.bind(t))

我的代码如下:

const promiseSerial = funcs =>
        funcs.reduce((promise, func) =>
          promise.then(result => func().then(Array.prototype.concat.bind(result))),
          Promise.resolve([]))

        const payments = this.payIDArray;

        const funcs = payments.map(payment => () => this.handleTransfer(payment))

        promiseSerial(funcs)
        .then(console.log.bind(console))
        .catch(console.error.bind(console))

我正在使用VueJS框架。

1 个答案:

答案 0 :(得分:1)

通读您发布的示例代码,我做了一些假设。

  • 首先,从您使用... promise.then(result => func().then ... 我假设this.handleTransfer(payment)返回一个 函数,该函数返回一个promise。
  • 第二,根据您的使用 关于串联,我假设您的API调用发回的数据是 数组。

下面的promiseSerial实现返回一个promise链,该链将解析为this.handleTransfer(payments)调用返回的所有数组的连接,同时保留调用顺序。

const promiseSerial = (funcs) => funcs.reduce((resultPromise, apiPromise) => {
    return resultPromise.then((concatenatedAPIResponses) => {
        const apiCallPromise = apiPromise(); //because this.handleTransfer(payment) returns a function  
        //const apiCallPromise = apiPromise; if this.handleTransfer(payment) returns a promise instead of a function

        return apiCallPromise.then((apiCallResponse) => {
            concatenatedAPIResponses = concatenatedAPIResponses.concat(apiCallResponse)
            return concatenatedAPIResponses
        })
    })
}, Promise.resolve([]))

Codepen here