如何从将每个api推入数组的函数中获取api？

Question

我正在尝试获取API数据，以便可以使用ReactJS在网页上呈现它。我尝试了多种方法来获取存储在数组中的api。但是我做不到。

注意：https://www.hatchways.io/api/assessment/workers/<worker_id>我在这里循环播放，因此工作者ID会添加网址的。

const fetchAPI = e => {
    let array = [];
    const api2 = `https://www.hatchways.io/api/assessment/workers/`;

    for (var i = 0; i <= 4; i++) {
      array.push(api2 + i);
    }
    return array;
  };
  console.log(fetchAPI());

提前感谢。

Answer 1

您需要先点击网址。异步/等待将是一个不错的选择。

<script>
  async function check()
  {
    var arrayData =[];
    var url = "https://www.hatchways.io/api/assessment/workers/";
    for(var i=1;i<=4;i++)
    {          
      const response = await fetch(url+""+i);
      const myJson = await response.json();
    }
    arrayData.push(myJson);
  }
  check();
</script>

Answer 2

例如使用Promise.all：

const baseURL = 'https://jsonplaceholder.typicode.com';

const fetchUsers = fetch(`${baseURL}/users`);
const fetchPosts = fetch(`${baseURL}/posts`);

Promise.all([fetchUsers, fetchPosts]).then((responses) => {
  const responsesToJson = responses.map(response => response.json());
  
  return Promise.all(responsesToJson);
}).then((jsonResponse) => {
  const [userResponse, postResponse] = jsonResponse;
  
  console.log(userResponse);
  console.log(postResponse);
});