Vue JS Promise Sequential与并行

Question

我在VueJS中有工作代码，但是需要一定的块才能顺序运行：

  return Promise.all(this.vm.multipleActions.run.map(function (testRun) {
    return self.initiateTest(testRun);
  }))

目前看来，这是并行运行的-因此，在initialTest（）中，我将记录插入数据库，但是并行获取了我的随机顺序，而不是testRuns的顺序（我想保留该顺序）。

由于并行性，我可以观察到initialTest（）中随机进行的AJAX调用。

Answer 1

如果你想返回的结果self.initiateTest(testRun)在返回的承诺，就像你的代码确实Promise.all ，你可以使用数组减少像这样功能

return this.vm.multipleActions.run.reduce((promise, testRun) =>
    promise.then(results => 
        self.initiateTest(testRun).then(result => {
            results.push(result);
            return results;
        })
    ), Promise.resolve([]) // initial promise to chain to
);

注意：如果使用箭头函数，则self.initiateTest可能是this.initiateTest但是，尚不清楚代码中的self是什么

返回的self.initiateTest(testRun)将解析为self.initiateTest(testRun)返回的一组（已解析的）结果

上述代码的非ES2015 +版本是

return this.vm.multipleActions.run.reduce(function (promise, testRun) {
    return promise.then(function (results) {
        return self.initiateTest(testRun).then(function (result) {
            results.push(result);
            return results;
        });
    });
}, Promise.resolve([]));

Answer 2

为了使它们按顺序运行，您需要在先前的测试完成后调用initiateTest 。

var promise = Promise.resolve();
this.vm.multipleActions.run.forEach(function (testRun) {
    promise = promise.then(function() {
        return self.initiateTest(testRun);
    });
})
return promise;

此代码将创建一个初始承诺，并立即解决。 每次测试运行都附加到Promise的then处理程序，因此它们仅在先前的Promise被解决后才执行。

或者进一步缩短它，可以使用reduce ：

return this.vm.multipleActions.run.reduce(function (promise, testRun) {
    return promise.then(function() {
        return self.initiateTest(testRun);
    });
}, Promise.resolve())