如何根据API返回数据抛错，且不触发当前try-catch的catch块？

问题出在你的catch块会捕获所有错误——包括你主动抛出的业务逻辑错误和axios的网络连接错误，导致业务错误被覆盖成了连接错误。要区分两种错误类型，分别处理即可。

方法一：利用axios的错误标识判断 #

axios抛出的错误会自带isAxiosError属性，可直接用来区分网络请求类错误和自定义业务错误：

import axios from 'axios'

export default async () => {
  try {
    const { data } = await axios('https://api.endpoint.com')
    
    if (data.credits < 10) {
      // 抛出业务逻辑错误
      throw new Error('No enough credits')
    } else {
      return 'All good'
    }

  } catch (error) {
    // 仅在axios网络请求失败时，抛出连接提示
    if (axios.isAxiosError(error)) {
      throw new Error('Error connecting...')
    } else {
      // 自定义业务错误原样抛出
      throw error
    }
  }
}

方法二：自定义错误类型（更规范） #

创建专属业务错误类，通过类型判断区分错误，可读性和扩展性更强：

import axios from 'axios'

// 定义业务错误类
class BusinessError extends Error {
  constructor(message) {
    super(message)
    this.name = 'BusinessError'
  }
}

export default async () => {
  try {
    const { data } = await axios('https://api.endpoint.com')
    
    if (data.credits < 10) {
      // 抛出自定义业务错误
      throw new BusinessError('No enough credits')
    } else {
      return 'All good'
    }

  } catch (error) {
    // 判断是否为业务错误
    if (error.name === 'BusinessError') {
      throw error
    } else {
      // 处理网络连接类错误
      throw new Error('Error connecting...')
    }
  }
}

原理说明 #

通过错误类型区分，让catch块只处理axios网络请求失败的场景，你的业务逻辑错误会被跳过处理、直接向上抛出，这样就能实现「连接失败时抛出连接错误，业务数据不满足时抛出对应业务错误」的需求。

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