1、修改index.ts

添加src/index.js请求转换代码：

  1. axios({
  2.   method: "post",
  3.   url: baseUrl + "/post",
  4.   headers: {},
  5.   timeout: 1000,
  6.   data: user,
  7.   transformRequest: function (data, headers) {
  8.     // 对请求 data 进行任意转换处理
  9.     return Object.assign(data, { code: 'transformRequest验证码' });
  10.   },
  12.   // // `transformResponse` 在传递给 then/catch 前，允许修改响应数据
  13.   transformResponse: function (data) {
  14.     // 对 data 进行任意转换处理
  15.     return data.status === 201;
  16.   },
  17. })
  18.   .then((response: AxiosResponse) => {
  19.     console.log(response);
  20.   })
  21.   .catch((error: any) => {
  22.     console.log(error);
  23.   });

2、修改types.ts

修改src/axios/types.ts文件，添加请求转换类型：

  1. export interface AxiosRequestConfig {
  2.   url?: string;
  3.   method?: Methods;
  4.   params?: any;
  5.   headers?: PlainObject;
  6.   data?: PlainObject;
  7.   timeout?: number;
  8.   // 请求转换器
  9.   transformRequest?: (data:any, headers: any) => any;
  10.   // 转换器响应
  11.   transformResponse?: (data: any) => any;
  12. }

3、修改Axios.ts

修改src/axios/Axios.ts文件，添加请求转换源码：

在拦截器之前添加请求转换：image.png

在返回相应结果前添加相应转换：
image.png

4、效果

请求转换结果：
image.png

相应转换结果：
image.png

5、源代码

代码地址：https://gitee.com/linhexs/handwritten-axios/tree/5.transformRequest-transformResponse/