javascript - 依次解决 Promise 会导致错误

Question

我一直在尝试循环遍历 ID 数组并将它们传递到调用 API 的函数 (this.handleTransfer) 中。我希望仅当收到上一次迭代的响应时才开始下一次迭代。 我决定谷歌一下如何使用 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 框架。

Answer 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