如何在第一次通话后重新调用承诺？

Question

如何在第一次调用后重新调用 promise？

我遇到这个问题，.then 仅在第一次点击后执行一次，此后的任何点击都不会执行此 console.log("Success!", response);。但我需要它来 回收利用 。可能吗？

用法：

$( document ).ready(function() {

    get('http://api.icndb.com/jokes/random').then(function(response) {
        console.log("Success!", response);
      }, function(error) {
        console.error("Failed!", error);
    });

});

承诺函数：

function get(url) {

  // Return a new promise.
  return new Promise(function(resolve, reject) {

      $(".promise").click(function(){

          // do lots of other stuff here...

           // Do the usual XHR stuff
            var req = new XMLHttpRequest();
            req.open('GET', url);

            req.onload = function() {
              // This is called even on 404 etc
              // so check the status
              if (req.status == 200) {
                // Resolve the promise with the response text
                resolve(req.response);
              }
              else {
                // Otherwise reject with the status text
                // which will hopefully be a meaningful error
                reject(Error(req.statusText));
              }
            };

            // Handle network errors
            req.onerror = function() {
              reject(Error("Network Error"));
            };

            // Make the request
            req.send();
      });

  });
}

html,

<a href="#" class="promise">Promise</a>

Answer 1

正如我在评论中解释的那样，一个承诺只能使用一次。一旦它被解决或拒绝，它的状态将永远设置并且它永远不会再次调用现有的 .then() 处理程序。因此，您不能对每次事件发生时要调用的内容使用承诺。你可能又回到了像这样的回调，这似乎非常适合这种情况：

$( document ).ready(function() {

    get('http://api.icndb.com/jokes/random', function(response) {
        console.log("Success!", response);
      }, function(error) {
        console.error("Failed!", error);
    });

});

function get(url, success, fail) {

    $(".promise").click(function(){

      // do lots of other stuff here...

       // Do the usual XHR stuff
        var req = new XMLHttpRequest();
        req.open('GET', url);

        req.onload = function() {
          // This is called even on 404 etc
          // so check the status
          if (req.status == 200) {
            // Resolve the promise with the response text
            success(req.response);
          }
          else {
            // Otherwise reject with the status text
            // which will hopefully be a meaningful error
            fail(Error(req.statusText));
          }
        };

        // Handle network errors
        req.onerror = function() {
          fail(Error("Network Error"));
        };

        // Make the request
        req.send();
    });
}

Answer 2

编写自己的 promisified get() 函数没有错，这正是 jQuery 的 $.ajax() 或 Angular 的 $http (和其他人）给你。

您需要做的就是稍微重新安排您的代码，以便：

get() 是通用实用程序，与特定事件无关
get() 根据需要从事件处理程序调用。

$(function() {
    function get(url) {
        return new Promise(function(resolve, reject) {
            var req = new XMLHttpRequest();
            req.open('GET', url);
            req.onload = function() {
                if (req.status == 200) {
                    resolve(req.response);
                } else {
                    reject(Error(req.statusText));
                }
            };
            req.onerror = function() {
                reject(Error("Network Error"));
            };
            req.send();
        });
    }
    $(".promise").click(function() {
        // do lots of other stuff here...
        get('http://api.icndb.com/jokes/random').then(function(response) {
            console.log("Success!", response);
        }, function(error) {
            console.error("Failed!", error);
        });
    });
});

我在这里所做的只是将您的代码行移动到不同的顺序。

如何在第一次通话后重新调用承诺？

How to I re-invoke the promise after the first call?

javascript

ajax

promise