TS 配置 axios 时遇到TS2339错误的解决办法

2022-08-15  本文已影响0人  煮茶忘放糖

假设 我们使用的接口返回以下参数:

{
    "error":0,
    "msg":"",
    "data":{}
}

如果我们在使用axios的过程中使用了响应拦截器,自定义了返回参数,则会报:TS2339: Property 'error' does not exist on type 'AxiosResponse '. 错误。同时 axios.create也会返回相同的错误(临时解决办法是axios.default.create,但在使用rollup打包时会报错)。

import axios, { Axios } from "axios";

const request: Axios = axios.create({
  baseURL: "https://localhost:8080",
  timeout: 30000
});

// 添加响应拦截器
request.interceptors.response.use(
  function (response: { status: number; data: any }) {
    // 对响应数据做点什么
    return Object.assign({ status: response.status }, response.data);
  },
  function (error: any) {
    // 对响应错误做点什么
    return Promise.reject(error);
  }
);

const { error, status, data, msg } = await request.get("/test");
// TS2339: Property 'error' does not exist on type 'AxiosResponse '.
console.info(error, status, data, msg);

解决办法就是追加声明:

import axios, { Axios, AxiosResponse, AxiosRequestConfig } from "axios";

declare module "axios" {
  interface AxiosResponse<T = any> {
    error: number;
    msg: string;
    // 这里追加你的参数
  }
  export function create(config?: AxiosRequestConfig): AxiosInstance;
}
上一篇下一篇

猜你喜欢

热点阅读