Javascript 如何使用React发出API请求？

我正在向美国农业部数据库发出API请求，但我无法通过React获得正确的信息。它只会给我带来我无法解决的不同CORS错误

我单独使用Javascript尝试了相同的API请求，它工作得很好，但现在在React中，我无法正确使用它

这是基于Javascript的

const BASE_API = `https://api.nal.usda.gov/fdc/v1/search?api_key=api_key`;
async function getData(url) {
  const response = await fetch(url, {
      method: "POST",
      body: JSON.stringify({
          generalSearchInput: "Cheddar cheese"
      }),
      headers: {
          "Content-Type": "application/json"
      }
  });
  const data = await response.json();
  return data;
}

这是在反应

fetchFoodID = async () => {
    const response = await fetch("https://api.nal.usda.gov/fdc/v1/search?api_key=api_key",{
        method: "POST",
        body: JSON.stringify({
            generalSearchInput: "Cheddar"
        }),
        headers: {
            "Content-Type": "application/json"
        }
    });
    const data = await response.json();
    this.setState({
        data: data
    });
};

---

使用Javascript，我可以获得带有搜索词的食物列表，但在React中，它只会引发不同的cors问题。

解决此类cors问题的最快方法是在主机文件中添加一个条目，将localhost映射到某个地址，并从中进行开发。显然，这是一个快速而肮脏的解决方案（因为它只解决了本地机器上的问题），但是如果你正在开发一个小项目供自己学习，那么这是一个不错的方法

127.0.0.1 your_custom_address

---

我确实运行了你的代码，它运行得很好。

第三行看起来不太正确

它只是给我带来了不同的CORS错误

。。。这些CORS错误具体是什么？因为有不同的错误是出于不同的原因。请参阅“如何寻求帮助”页面以澄清此问题。-非常感谢。我现在就试试