React中如何将API返回的数据添加至数组并打印该数组？

以下是几种常用实现方案：

原生fetch（Promise链式调用） #

// 初始化空数组
let dataArray = [];

// 发起API请求
fetch('你的API接口地址')
  .then(res => res.json()) // 解析返回的JSON数据
  .then(apiData => {
    // 单个对象数据存入数组
    dataArray.push(apiData);
    // 若API返回的是数组，可直接合并：dataArray = [...dataArray, ...apiData];
    
    // 打印数组
    console.log(dataArray);
  })
  .catch(err => console.error('请求出错:', err));

async/await写法（更简洁直观） #

async function handleApiData() {
  let dataArray = [];
  try {
    const res = await fetch('你的API接口地址');
    const apiData = await res.json();
    
    // 添加数据到数组
    dataArray.push(apiData);
    // 打印结果
    console.log(dataArray);
  } catch (err) {
    console.error('请求失败:', err);
  }
}

// 执行函数
handleApiData();

注意事项 #

• 如果API返回的是数组格式，直接用push会把整个数组作为单个元素存入，此时建议用扩展运算符...或concat来合并两个数组。
• 必须添加错误捕获逻辑，避免请求失败导致代码阻塞。

内容的提问来源于stack exchange，提问作者deadier