如何在没有在执行程序函数中添加事件处理程序的情况下将 Promise 与“click”事件一起使用？

Question

编辑：试图澄清问题并缩短它——我输入了一些代码来表明我曾试图解决这个问题，但我认为它只会让事情变得混乱。

我是 Promise 新手，我正在尝试转换一些现有代码（这很简单）以使用 Promise。

我想使用 promise 将按钮点击链接到我程序的其他部分，也就是说，我想将点击视为异步事件（例如，类似于 ajax 调用）。如何做到这一点？

从 MDN 文档中，promise 基本上是这样工作的

function myAsyncFunction(url) {
  return new Promise((resolve, reject) => {
    const xhr = new XMLHttpRequest();
    xhr.open("GET", url);
    xhr.onload = () => resolve(xhr.responseText);
    xhr.onerror = () => reject(xhr.statusText);
    xhr.send();
  });
}

我完全理解这一点。据我了解，以下内容会起作用

function myPromiseGenerator() {
  return new Promise((resolve, reject) => {
   this.myButton.addEventListener('click',function(e) {
    /// do something to process the answer
    resolve(something);
    }
  });
}

但是如何删除事件侦听器？我只想添加一次事件侦听器，而不是在每次调用时添加，myPromiseGenerator但我不知道如何使其工作。

一般来说，做我想做的事情的最佳方法是什么？谢谢你的帮助。

Answer 1

只需使用once事件侦听器的选项：

function myPromiseGenerator() {
  return new Promise((resolve, reject) => {
    this.myButton.addEventListener('click',function(e) {
        /// do something to process the answer
        resolve(something);
    }, {once: true});
  });
}