HarmonyOS 数据类中的方法无法被调用-鸿蒙开发者社区-51CTO.COM

HarmonyOS 数据类中的方法无法被调用

HarmonyOS 数据类中的方法无法被调用-鸿蒙开发者社区

HarmonyOS
2024-11-05 09:51:53
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
FengTianYa

json转自定义class对象时,需要用new出来的对象才具有class实例方法,例如以下代码:

@Observed 
class Model { 
  title: string = "" 
  constructor(title:string) { 
    this.title = title 
  } 
  action() { 
    console.log('调用方法'); 
  } 
} 
 
@Entry 
@Component 
struct Index { 
  jsonstr:string = '{"title":"点我调用方法"}' 
  @State model: Model = new Model('111') 
  aboutToAppear(): void { 
    const tempModel: Model = JSON.parse(this.jsonstr) 
    this.model.title = tempModel.title 
  } 
  build() { 
    Row(){ 
      OtherComponenft({model: this.model}) 
        .onClick(()=>{ 
          this.model.action() 
        }) 
    }.width("100%") 
    .height(100) 
  } 
} 
@Component 
struct OtherComponenft { 
  @ObjectLink model: Model 
  build() { 
    Text(this.model.title) 
      .fontSize(20) 
      .fontColor(Color.Black) 
      .width(200) 
      .height(50) 
      .margin({ 
        left:20 
      }) 
  } 
}

​如果数据结构比较复杂,数据量比较大,不想在解析的时候,每个对象都new一次,建议使用第三库reflect-metadata 和 class-transformer。

安装方法:

ohpm install class-transformer
ohpm install reflect-metadata

参考代码:​

import { plainToClass, Type } from 'class-transformer'; 
import 'reflect-metadata'; 
 
class ResponseObj { 
  @Type(() => Person) 
  data: Person[] = []; 
} 
 
@Entry 
@Component 
struct TestJson { 
  @State list: Person[] = []; 
  @State message: string = 'Click me'; 
 
  aboutToAppear(): void { 
    let str = '{"data" : [{"number" :1,"age": 20, "testA": { "str" : "123"}},{"number" :2,"age": 21,"testA": {"str" : "456"}}]}' 
    let jsonData: ESObject = JSON.parse(str) 
    let responseObj: ResponseObj = plainToClass(ResponseObj, jsonData); 
    console.log(` ${responseObj.data[0] instanceof Person}`) 
    this.list = this.list.concat(responseObj.data); 
  } 
 
  build() { 
    Row() { 
      Column() { 
        ForEach(this.list, (item: Person, index: number) => { 
          ViewA({ index: index, testA: item.testA }) 
        }) 
      } 
      .width('100%') 
    } 
    .height('100%') 
  } 
} 
 
@Observed 
export class TestA { 
  public str : string 
 
  constructor(str: string) { 
    this.str = str; 
  } 
} 
 
export class Person { 
  name: string = '' 
  age: number = 1 
 
  @Type(()=>TestA) 
  testA: TestA = new TestA('') 
} 
 
@Component 
export struct ViewA { 
  @ObjectLink testA: TestA 
  index: number = -1; 
 
  build() { 
    Row(){ 
      Button(`View A ${this.testA.str}`).onClick(() =>{ 
        this.index += 1; 
        this.testA.str = `${this.index} : Test A String` 
      }) 
    }.margin({top : 10 }) 
  } 
}
分享
微博
QQ
微信
回复
2024-11-05 17:54:24
相关问题
native侧如何调用静态方法
1040浏览 • 1回复 待解决
HarmonyOS js调用webview方法
347浏览 • 1回复 待解决
在c++实例化自定义调用方法
248浏览 • 1回复 待解决
ArkTS调用C++成员函数
1202浏览 • 1回复 待解决
RdbPredicates无法声明
114浏览 • 1回复 待解决
JSBind 如何调用 JS 方法 callback
1602浏览 • 1回复 待解决
数据文件写入数据方法
286浏览 • 1回复 待解决