ts+axios 定义接口返回值的类型

项目场景:

我尝试去定义 Promise<自定义>里的自定义的类型,希望与数据接口返回的类型一致目的是希望类型定义好之后可以不用去看文档也能知道这个接口返回的是哪些数据


描述

Axios 是一个基于 promise 的 HTTP 库:
需要使用Promise< 自定义>

公用get请求

/**
 * 公用get请求
 * @param url       接口地址
 * @param msg       接口异常提示
 * @param headers   接口所需header配置
 */
export const get = ({ url, msg = '接口异常', config }: IFRequestParam) => {
  axios.defaults.headers.common['Authorization'] = umbrella.getLocalStorage('user_token');
  return axios
    .get(url, config)
    .then((res) => {
      return res.data;
    })
    .catch((err) => {
      if (err.response && err.response.data.statusCode === '401) {
        // message.warn('请先登录');
        window.location.href = '/';
      } else if (!err.response || !err.response.data) {
        message.error(`API Server ${err.toString()}`);
        return;
      }
      if (err.response.status !== 200) {
        message.error(err.response.data.message || msg);
        return err.response.data;
      }
      message.error(err.response.data.message || msg);
    });
};

接口实例:

接口:http://10.0.1.1/GetData

参数:

参数类型
statusCodenumber
messagestring
valueArray< >
//类型
type ID = string;

interface ResponseOriginal<T> {
  statusCode?: number;
  message?: string;
  value: T;
}
type Response<T> = ResponseOriginal<T> | undefined;
//value
interface Value{
  item1: {name:string | null,num:number};
  item2: ArrayValueItem3 [];
  item3: any[];  //或any一步到位....
  }
interface ArrayValueItem3 {
  key:number | string,
  id:string,
  label:string
}

//接口
export const GetData = (
  id: ID
): Promise<Response<Value>> =>   //或Promise<Response<any>>不过这样未知value里面的数据
  get({
    url: `${http://10.0.1.1}/GetData`,
    config: { params: { id } },
  });

ts+axios案例

  • 2
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值