javascript - 如何在交互式调用中使用 Promise？

Question

我正在检索一个表单(通过 XMPP、XEP-0004)，为其创建一个交互式表单对话框，然后在对话框关闭时提交该表单。

代码(为简单起见，大致近似):

function form(name, callback) {
  server.getForm(name, function(response) {
    callback(response.formFields, function (data) {
      server.submitForm(name, data);
    });
  });
}

function main() {
  form('example', function(fields, callback) {
    var dialog = ui.formDialog(fields);
    dialog.addButton('submit', function(data) {
      callback(data);
    });
    dialog.show();
  });
}

注意调用者和被调用者如何在一个方向上交换回调，以获取从服务器检索的字段；另一方面，用于用户提交的数据。

我最近发现了 JS Promises，我想知道它们是否可以更优雅地替换回调。

我已经做到了:

function form(name) {
  return new Promise((resolve, reject) => {
    server.getForm(
      name,
      (response) => { resolve(response.formFields) },
      reject
    );
  });
}

function main() {
  form('example').then((fields) => {
    var dialog = ui.formDialog(fields);
    dialog.addButton('submit', /* ... */);
  });
}

但现在我陷入了困境，因为我无法将提交按钮的事件传递回 form() 调用。

我也不能简单地为对话框创建一个 Promise，因为我必须首先创建该 Promise 才能将其传递给 form()，但我需要由在创建对话框之前要解决 form() 问题。存在某种引导问题。

这里有什么方法可以使用 promise ，或者我应该坚持来回传递回调吗？

Answer 1

您可以将问题分为三个部分:

1. form - 检索表单 - 函数，该函数采用名称并返回通过字段解析的 Promise。
2. askUser - 收集输入 - 接受字段、显示表单并返回包含提交数据的 Promise 的函数。
3. submit - 提交表单 - 获取数据并返回网络结果 Promise 的函数。

您可以将这三个组合在一起:

form('example')
  .then(askUser)
  .then(submit)
  .catch(errorHandler)

这将返回一个最终通过提交操作解决的 Promise。