jquery中的延迟链

Question

我需要连续发出 3 个请求。所以为此我使用 jquery defered。

Request 1 
-> on done if response contains expected result then Request 2 else return empty array/null
-> on done if response contains expected result then Request 3 else return empty array/null

---

private request1() {
    const vm = this;

    vm.isLoading(true);
    let deffer = system.defer(dfd => {dataService.getResponse1()
       .done((response) => {
              request2(response.collection))
              dfd.resolve();
       });

    return deffer.promise();
}

private request2(collection) {
     dataService.getResponse2(collection)
        .done((response) => request3(response.collection));
}

private request3(collection) {
     dataService.getResponse3(collection)
        .done((response) => saveResponse(response.collection));
}

private saveResponse(collection) {
    //do some stuff    
}

在构造函数中我调用request1 像

vm.request1().done(() => {
      vm.isLoading(false);
});

问题是isLoading 在调用saveResponse 之前被设置为false。在所有请求完成后，我应该如何正确重构我的请求结构以更新 isLoading？

谢谢。

Answer 1

试试这个方法（请查看代码中的cmets）：

// Request 1 -> on done Request 2 -> on done -> Request 3

private request1() {
    const vm = this;

    vm.isLoading(true);
    let deffer = system.defer(dfd => {dataService.getResponse1()
       .done((response) => {
              // 1. Here you have to resolve the dfd promise after 
              // request2 promise is resolved. For this reason,
              // I added the call to "done()" method.
              request2(response.collection)).done((response2) => { dfd.resolve()});
       });

    return deffer.promise();
}

private request2(collection) {
     // 2. You need to return the promise returned by getResponse2
     return dataService.getResponse2(collection)
        .done((response) => request3(response.collection));
}

private request3(collection) {
     // 3. You need to return the promise returned by getResponse3
     return dataService.getResponse3(collection)
        .done((response) => saveResponse(response.collection));
}

private saveResponse(collection) {
    //do some stuff    
}

因此，在request3() 中，您返回由getResponse3() 返回的承诺，而后者又返回由在done() 方法中调用的saveResponse() 返回的承诺。

在request2() 中，您返回由getResponse() 返回的promise，而后者又返回由上一段中描述的request3() 返回的promise。

在 request1() 中，在主要的 done() 回调中，您调用 request2() 并等待（使用 done()）它完成，然后再解决主要的承诺。

这样vm.isLoading(false)应该在request2和request3完成后调用。

Answer 2

简短回答：在调用 saveResponse 之后，将 vm.isLoading(true); 移动到 request3 的正文中。