javascript - 异步等待状态已解决但 ajax 未完成

Question

我正在尝试等待 getJson 调用并处理返回的数据。我看过很多答案，并尝试使用 $.ajax 的 async: false(不起作用，因为查询是跨域的)、回调和.done 基本 $.ajax 调用的一部分。现在我正在尝试异步等待。我的代码如下所示:

var ths = getTrailheads(turl);
console.log("trailheads promise");
console.log(ths);
ths.then(function(data) {
  addTrailheadsToMap(data);
});

async function getTrailheads(turl) {
  var result = await $.ajax({
    url: turl,
    datatype: 'json'
  });

  return result;
}

如果 ajax 调用返回得足够快，它有时会起作用，但大多数情况下，控制台日志显示:

这显示了 status 设置为 Resolved 的 promise 。 promise 对象在那里，但对象状态显示 Processing。

这是一个常见的情况，但常见的答案似乎对我不起作用，因此我们将不胜感激。

更新:

  preGetTrailheads(turl);
}
async function preGetTrailheads(turl) {
  var ths = await getTrailheads(turl);
  console.log("trailheads promise");
  console.log(ths);
  addTrailheadsToMap(ths);

}
async function getTrailheads(turl) {
  var result = await $.ajax({
    url: turl,
    datatype: 'json'
  });

  return result;
}

现在我取回对象而不是 promise，但对象仍处于“正在处理”状态，然后在我尝试使用它时失败。 object dump

更新 2:我相信你们两个都是对的，你描述的方式就是你做事的方式。我这里有一个codepen https://codepen.io/mckee80/pen/KJBbvz .它大部分时间都有效。它似乎只在您第一次运行时失败(另外，成功时输出会进入浏览器日志)。我只需要弄清楚为什么它会在我的应用程序上发生。奇怪的是，如果我重新加载页面，它适用于给定的数据集。

Answer 1

您在 getTrailheads 中正确使用了 async/await，但是调用它的代码也需要使用 async/await 或以其他方式处理 promises。假设代码可以是 async 你可能只需要在调用之前添加 await :

var ths = await getTrailheads(turl);

async/await 或多或少是 promises 之上的语法糖，这就是为什么不等待 getTrailheads 的结果返回一个 promise。如果效果更好，您还可以使用 getTrailheads(turl).then(ths => {...})。