typescript Axios 存储数据字段名与默认不一致

Question

问题描述

在使用 typescript+axios 获取服务器数据时,服务器返回的数据格式

{
  status: number
  msg: string
  result?: ICityInfo[]
}

export interface AxiosResponse<T = any>  {
  data: T;
  status: number;
  statusText: string;
  headers: any;
  config: AxiosRequestConfig;
  request?: any;
}

服务器返回数据存储数据的字段名是 result
而 AxiosResponse 存储数据的字段名是 data

相关代码

async (dispatch: Dispatch) => {
    const response = await queryWeatherData()
    let data = response.data
    dispatch({
      type: weatherAction.GET_WEATHER,
      data
    })
  }

你期待的结果是什么？实际看到的错误信息又是什么？

我期待的结果是编译器可以通过我所定义的字段名 result 来修改默认数据的字段
实际的错误信息是

Property 'result' does not exist on type 'AxiosResponse<T>'.

Answer 1

response.data.result

Answer 2

我觉得你弄混了 AxiosResponse是给axios用的 data才是服务器返回给你的东西

Answer 3

可以看看 queryWeatherData 的实现吗？

Answer 4

import axios from 'axios'

declare module 'axios' {
  export interface AxiosResponse<T = any> extends Promise<T> {}
}

github原答案链接：How to use Axios with TypeScript when using response interceptors (AxiosResponse issue)