如何在Promise.all中当API无数据返回时抛出错误？

要实现API返回无数据时让Promise.all抛出错误，你需要对现有代码做三处关键修改：

1. 修正Promise.all的参数 #

原代码中Promise.all传入的是函数引用（fruitsColor、fruitsType），这会导致Promise直接resolve函数本身，不会执行异步请求。必须调用函数获取Promise实例。

2. 在API请求中添加无数据判断 #

在每个异步请求函数里，拿到返回数据后判断是否为空（根据业务场景调整判断逻辑，比如数组为空、数据为null/undefined等），为空则抛出错误。

3. 调整错误处理逻辑 #

原代码的catch直接返回空对象，现在改为抛出错误，确保Promise.all在出现HTTP错误或无数据时进入reject状态，让上层可以捕获处理。

修改后的完整代码 #

// 提取通用请求逻辑，减少重复代码
async function fetchAndValidate(url: string, emptyMsg: string): Promise<any[]> {
  const response = await fetch(url);
  if (!response.ok) {
    throw new Error('API请求失败');
  }
  const data = await response.json();
  // 根据实际业务判断数据是否为空，这里以数组为空为例
  if (!data || (Array.isArray(data) && data.length === 0)) {
    throw new Error(emptyMsg);
  }
  return data;
}

export const fruitsColor = async (): Promise<any[]> => {
  return fetchAndValidate('你的API地址', '无水果颜色数据');
};

export const fruitsType = async (): Promise<any[]> => {
  return fetchAndValidate('你的API地址', '无水果类型数据');
};

export const getFruitsData = async (): Promise<FruitsStoreType> => {
  try {
    const [colorData, typeData] = await Promise.all([
      fruitsColor(),
      fruitsType(),
    ]);
    return {
      color: colorData,
      type: typeData,
    };
  } catch (error) {
    // 将错误抛出，让上层调用者处理（比如显示错误提示）
    throw error;
    // 如果需要错误时返回默认值+错误信息，可改为：
    // return {
    //   color: [],
    //   type: [],
    //   error: (error as Error).message
    // } satisfies FruitsStoreType & { error?: string };
  }
};

关键说明 #

• 通用请求函数：fetchAndValidate封装了重复的请求、HTTP错误判断、无数据校验逻辑，避免代码冗余。
• 无数据判断：根据你的实际API返回结构调整判断条件，比如如果返回的是对象，可检查Object.keys(data).length === 0。
• 错误抛出：在getFruitsData的catch中抛出错误后，上层调用时可以用try/catch捕获，例如：

  async function loadFruits() {
    try {
      const data = await getFruitsData();
      // 处理正常数据
    } catch (err) {
      console.error(err.message);
      // 显示错误提示给用户
    }
  }
  

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