jquery 中的延迟链

Question

我需要链式提出 3 个请求。所以为此我使用 jquery deffered.

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

试试这个方法（请检查代码中的注释）：

// 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() 中，您 return 由 getResponse3() 编辑的承诺 return 反过来，return 承诺 return由在 done() 方法内部调用的 saveResponse() 编辑。

在 request2() 中，您 return 由 getResponse() 编辑的承诺 return 反过来，return 是 return 编辑的承诺由 request3() 在上一段中描述。

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

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

Answer 2

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

jquery 中的延迟链

Deferred chains in jquery

javascript

jquery

typescript

jquery-deferred

chaining