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

问题描述 投票:0回答:1

我有用于调用API的常规方法Request(method: HttpMethod, url: string, ...)。我正在使用TypeScript。

我需要使用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

我做错了什么?

javascript typescript javascript-objects transformation class-transformer
1个回答
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);

© www.soinside.com 2019 - 2024. All rights reserved.