如何使用 TypeScript 中的“class-transformer”将 API 请求的响应转换为类实例？

Question

我有用于调用 API 的普通方法Request(method: HttpMethod, url: string, ...) 。 我正在使用打字稿。

我需要使用class-transformer （或没有它：D）将来自此 API 请求的响应转换为类实例。

例子：

class UserResponse {
  id: number;l
  foo: string;
  bar: string;
}
const user = await Request(HttpMEthod.GET, '/user/1');
// `user` should be class instance `UserResponse`

我知道我不能像这样使用泛型：

const Request = <T>(method: HttpMethod, url: string, ...) => {
  // axios or something else...
  return plainToClass(T, res);
}

const user = await Request<UserResponse>(HttpMEthod.GET, '/user/1');

泛型不能那样工作，但我可以这样做：

const Request = <T>(method: HttpMethod, url: string, ...,  transformTo?: { new (): T }) => {
  // axios or something else...
  return plainToClass(transformTo, res);
}

const user = await Request(HttpMEthod.GET, '/user/1', ... , new UserResponse());

但这也行不通。 我仍然得到user类型：

const user: unknown

我做错了什么？

Answer 1

首先，什么是Request ？ 我假设这会返回一个Promise 。

你有几个问题：

1. 你从来没有真正将你的响应映射到一个new UserResponse
2. TypeScript 中的泛型不会更新响应。 它更像是一个interface ，它更像是一个数据契约而不是一个完整的初始化类。

这是您需要执行此操作的方法：

 class UserResponse { public id: number; public foo: string; public bar: string; constructor(user: UserResponse) { Object.assign(this, user); // or set each prop individually } } const response = await Request(HttpMEthod.GET, '/user/1'); const user = new UserResponse(response);

基本上，您需要向类中添加一个constructor （否则，只需使用interface ）。 获得constructor ，您就可以从响应中新建一个新的UserResponse类。

另外，如果Request看起来像：

const Request = <T>(method: HttpMethod, url: string, ...,  transformTo?: { new (): T }) => {
  // axios or something else...
  return plainToClass(transformTo, res);
}

我认为你想这样做： const user = await Request(HttpMEthod.GET, '/user/1', ... , UserResponse);