在提供的代码中,您使用了 TypeScript 来定义一个响应式拦截器,用于处理 axios 的响应。您遇到了一个 TypeScript 类型报错,特别是在尝试返回 response.data 时。这个问题可能是因为 TypeScript 编译器无法正确推断 response.data 的类型。为了解决这个问题,您需要确保 ApiResponse 接口中的泛型 T 能够正确地与 response.data 的类型匹配。以下是一个可能的解决方案:

// 响应拦截器
instance.interceptors.response.use (
  response => {
    // 处理业务失败
    const data = response.data as ApiResponse<any> // 明确指定泛型
    if (data.code !== 10_000) {
      showFailToast(data.message || '业务失败')
      return Promise.reject(new Error(data.message || '业务失败'))
    }
    // 摘取核心数据
    return response.data;
  },
  (error: AxiosError) => {
    if (error.response?.status === 401) {
      // 401 未授权,清除用户信息
      const store = useUserStore()
      store.clearUser()
      // 保留当前地址,并跳转到登录页面
      // 使用 void 明示不处理 promise
      void router.push({
        path: '/login',
        query: { redirect: router.currentRoute.value.fullPath },
      })
    }
  },
)

在这个修改中,我添加了 ApiResponse<any> 来明确指定泛型 T。这应该能够解决 TypeScript 编译器在处理 response.data 时的类型推断问题。如果 response.data 的实际类型是已知的,您也可以将 any 替换为具体的类型。希望这能帮助您解决问题!

标签: none

评论已关闭