Question

我首先说我不是100％肯定这是问题所在，我的意思是使用await和async。

这是场景：

我在第一次加载页面时运行此程序，并且运行正常，我得到了data：

    externalContent(url);

    function externalContent(url) {
      fetch(url)
      .then(res => res.json())
      .then(data => {
        ...cool data...
      });
    }

但是我需要能够单击一个按钮，然后使用fetch

重新运行该功能。

我愿意

    $(".alm-filters--button").on("click", function() {
      externalContent(url);
    });

但是当我单击时，它在.then(res => res.json())上给我一个错误

错误说： 未捕获（承诺）TypeError：无法读取未定义的属性'then'

我尝试过有一个异步问题，但是我对使用异步和等待不了解，但我尝试过：

    async function externalContent(url) {
      await fetch(url)
      .then(res => res.json())
      .then(data => {
         ...cool data...
      });
    }

但是，我也遇到同样的错误。

Answer 1

引用this article应该可以解决您的问题。也请参见代码段。

async function exampleFetch() {
    const response = await fetch('https://reqres.in/api/users/2');
    const json = await response.json();
    console.log(json);
}

exampleFetch()

await替代.then()，因此，在使用await fetch时，您根本不需要使用.then()。

还有另外两个答案或多或少涉及同一问题：

1-How can I acces the values of my async fetch function? [duplicate]

2-{{3}}

如何在异步/等待中使用提取？

1 个答案: