用 then/catch 承诺结果

【问题标题】：Promise result with then/catch用 then/catch 承诺结果
【发布时间】：2016-09-28 13:30:31
【问题描述】：

我在 react APP 中测试了 ES6 Promise，但我的 .then 没有结果：

function addItem (value) {
  return new Promise((resolve, reject) => {
    document.getElementById('todo').innerHTML += `<li>${value}</li>`;
  });
}

addItem(value).then(() => {
  alert('then !');
}).catch((err) => {
  console.log(err)
})

我的函数已执行，但我的 then 没有事件。

你知道我哪里错了吗？谢谢！ :)

【问题讨论】：

您的addItem 函数不是异步的，因此您可能不应该让它返回Promise。如果您这样做是为了能够在之后链接 then 调用，您可以从 Promise.resolve(addItem(value)).then(...) 开始。

标签： javascript promise ecmascript-6

【解决方案1】：

Promise 用于异步任务。使用它们来执行同步代码是没有意义的。在您的示例中，then() 不起作用，因为您永远不会解决承诺。为了解决它，您需要致电resolve()。

【讨论】：

不完全正确。如果要公开异步 API，可以将 Promise 用于同步任务。这样您就可以稍后切换到异步实现。
@JakubHampl 是的，但这是一个罕见的用例，在这种情况下最好简单地返回 Promise.resolve() 而不是将整个代码包装在 Promise 中。

【解决方案2】：

您需要在您的承诺中调用拒绝或解决。

function addItem (value) {
  return new Promise((resolve, reject) => {
    document.getElementById('todo').innerHTML += `<li>${value}</li>`;
    resolve();
  });
}

【讨论】：

谢谢！我已经添加了这个：resolve(document.getElementById('todo').innerHTML +=
${value}

);

【解决方案3】：

你需要兑现你的承诺，例如：

function addItem (value) {
  return new Promise((resolve, reject) => {
    document.getElementById('todo').innerHTML += `<li>${value}</li>`;
    resolve(10);
  });
}

addItem(value).then((data) => {
  alert('then !');
  console.log(data);// 10
}).catch((err) => {
  console.log(err)
})

【讨论】：

【解决方案4】：

您忘记在 Promise 中调用 resolve 和 reject 函数。

resolve 是您在完成操作后调用的函数。

resolve();

您传递给resolve() 的参数是您在then 函数中返回的参数。

reject 是您在操作出错时调用的函数。如果您没有任何要拒绝的内容，那么您可以将其忽略，而不必调用它。

reject();

您传递给reject() 的参数是您在catch 函数中返回的参数。

【讨论】：