ts(TypeScript)定义服务器返回数据类型

ts(TypeScript)定义服务器返回数据类型

1.定义基本返回类型

export type JSONResponse = {
  stat: string;
  msg?: string;
};

stat：状态
msg：提示信息
（msg后面的？问号表示该参数是可选的，服务器可能返回，也可能不返回）

2.服务器返回为多个同类型数据时

先定一个返回的泛型

export type Rows<T extends any> = {
  items: T[];
  total: number;
};

items:单个数据
T：单个数据的数据类型的泛型，用的时候传入什么类型，它就是什么类型
total：总数（分页加载，触底加载时使用）

使用时定义某个接口返回的具体数据类型

比如是一个联系人列表

export interface Contact{
  name: string; // 姓名
  phone: string; // 手机号
  email: string; // 邮箱
  avatar: string; // 头像
  userid: string; // id
}

则接口返回的数据类型可定义为

export interface ContactResponse extends JSONResponse {
  data: Rows<Contact>;
}

在接口中使用定义好的数据类型

即ContactResponse

export function getContactInfo() {
  return http.post<ContactResponse>;
}

http请求（可以自己封装，也可以直接使用axios）
这样使用接口请求回来的数据的数据类型就定义好了
调用接口，自动定义好类型，这样可以通过点 . 去访问数据。