鸿蒙Next开发json转模型方案 class-transformer

引入必备的三方框架

  "dependencies": {
    "reflect-metadata": "^0.1.13",
    "class-transformer": "^0.5.1"
  },
import 'reflect-metadata'
import { Expose, Type, plainToInstance } from 'class-transformer'
import { ObservedArray } from 'commlib'

@Observed
export class HFHotStockModel {
  @Expose({ name: 'code' })
  stockCode: string = ''
  @Expose({ name: 'name' })
  stockName: string = ''
  @Expose({ name: 'tag' })
  tagName?: string = ''
  lastPrice: string = ''
  priceRange: string = ''
  @Expose({ name: 'hot' })
  hotValue: number|null = null
  stockType: number = 0
  isSelected: boolean = true

}
@Observed
export class HFHotStockSectionModel {
  title: string|null = null
  @Type(() => HFHotStockModel)
  stocks: ObservedArray<HFHotStockModel> = []

}
@Observed
export class HFHotStockTabDataModel {
  @Expose({ name: 'from' })
  sourceID: string =''
  @Expose({ name: 'name' })
  sourceName: string =''
  @Type(() => HFHotStockSectionModel)
  content: HFHotStockSectionModel[] =[]

  public static plainToModel(obj: Object): HFHotStockTabDataModel {
    return plainToInstance(HFHotStockTabDataModel, obj)
  }
}

@Observed
export class HFHotFundModel {
  @Expose({ name: 'fundCode' })
  fundCode: string = ''
  @Expose({ name: 'fundName' })
  fundName: string = ''
  riskLevel: string = ''
  fundType: string = ''
  @Expose({ name: 'tip' })
  upDownPercentMark: string = ''
  upDownPercent: string|null|undefined
  isSelected: boolean = true
}

@Observed
export class HFHotFundSectionDataModel {
  markName?: string
  groupName?: string
  @Type(() => HFHotFundModel)
  funds: HFHotFundModel[] = []

  public static plainToModel(obj: Object): HFHotFundSectionDataModel {
    return plainToInstance(HFHotFundSectionDataModel, obj)
  }
}

定义的Interface

export interface HFHotStockEntityI {
  name: string
  code: string
  tag: string
  upDownValue: string
  upDownPercent: string
  hot: string
}
export interface HFHotStockSectionEntityI {
  title: string
  stocks: HFHotStockEntityI[]
}
export interface HFHotStockDataModelI {
  from: string
  name: string
  content: HFHotStockSectionEntityI[]
}

export interface HFHotResponseDataModelI {
  data: HFHotStockDataModelI[]
}

export interface HFHotFundEntityI {
  fundName: string
  fundCode: string
  riskLevel: string
  fundType: string
  tip: string
  upDownPercent: string
}
export interface HFHotFundGroupModelI {
  markName: string
  groupName: string
  funds: HFHotFundEntityI[]
}

使用的地方,业务代码

  public async pullHFHotStockDataNet(): Promise<HFHotStockTabDataModel[]> {
    try {
      const data = await this.hotStockNet.getHotStocks()
      const groupModelList = data.map((item: HFHotStockDataModelI, index: number) => {
        const group: HFHotStockTabDataModel = HFHotStockTabDataModel.plainToModel(item)
        return group
      })
      return groupModelList
    } catch (error) {
      return Promise.reject(error)
    }
  }

  public async pullHFHotFundDataNet(): Promise<HFHotFundSectionDataModel[]> {
    try {
      const data = await this.hotStockNet.getHotFunds()
      const groupModelList = data.map((item: HFHotFundGroupModelI, index: number) => {
        const group: HFHotFundSectionDataModel = HFHotFundSectionDataModel.plainToModel(item)
        return group
      })
      return groupModelList
    } catch (error) {
      return Promise.reject(error)
    }
  }

类模型就自动生成好了,免去手动赋值。类似于iOS的 YYModel、MJExtension框架。

下面详细介绍

class-transformer 是一个流行的 TypeScript 库,用于在对象之间进行转换。它可以帮助你在 JavaScript 对象和类实例之间进行序列化和反序列化操作。这对于处理 API 响应、验证数据以及将数据映射到特定的类结构非常有用。

下面是一个详细的示例,展示如何使用 class-transformer 进行对象转换。

安装依赖

首先,你需要安装 class-transformerreflect-metadatareflect-metadata 是一个运行时反射库,class-transformer 依赖于它来获取类型信息。

npm install class-transformer reflect-metadata

示例代码

假设我们有一个简单的用户类,并且我们需要从 JSON 数据中创建这个类的实例。

1. 定义类

首先,定义一个简单的用户类,并使用 @Expose@Transform 装饰器来控制属性的暴露和转换行为。

2. 使用 plainToClass 进行转换

接下来,使用 plainToClass 函数将普通的 JavaScript 对象转换为 User 类的实例。

3. 使用 classToPlain 进行转换

同样地,可以使用 classToPlain 函数将 User 类的实例转换回普通的 JavaScript 对象。

完整示例

以下是完整的示例代码,展示了如何定义类并进行双向转换。

解释

  1. 导入必要的模块

    • reflect-metadata:提供运行时反射能力。
    • class-transformer:提供 plainToClassclassToPlain 等函数。
  2. 定义类

    • 使用 @Expose 装饰器来指定哪些属性应该被包含在转换过程中,并可以重命名属性名称。
    • 使用 @Transform 装饰器来对属性进行自定义转换,例如将字符串日期转换为 Date 对象。
  3. 转换过程

    • 使用 plainToClass 将普通对象转换为类实例。
    • 使用 classToPlain 将类实例转换回普通对象。
import "reflect-metadata";
import { Expose, Transform, plainToClass, classToPlain } from "class-transformer";

class User {
    @Expose()
    id: number;

    @Expose({ name: 'first_name' })
    firstName: string;

    @Expose({ name: 'last_name' })
    lastName: string;

    @Expose()
    email: string;

    @Expose()
    age: number;

    @Expose({ name: 'created_at' })
    @Transform(({ value }) => new Date(value))
    createdAt: Date;
}

const userData = {
    id: 1,
    first_name: "John",
    last_name: "Doe",
    email: "john.doe@example.com",
    age: 30,
    created_at: "2023-01-01T00:00:00Z"
};
const userInstance = plainToClass(User, userData);
console.log("Converted to Class Instance:", userInstance);

const plainObject = classToPlain(userInstance);
console.log("Converted back to Plain Object:", plainObject);
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 214,875评论 6 496
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 91,569评论 3 389
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 160,475评论 0 350
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 57,459评论 1 288
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 66,537评论 6 386
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 50,563评论 1 293
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,580评论 3 414
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,326评论 0 270
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,773评论 1 307
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,086评论 2 330
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,252评论 1 343
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,921评论 5 338
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,566评论 3 322
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,190评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,435评论 1 268
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 47,129评论 2 366
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,125评论 2 352

推荐阅读更多精彩内容