鸿蒙 ArkTS 小记

540 阅读1分钟

1. interface vs class

1.1 初始化

i. class 提供默认值,不实现构造方法

export interface SearchTextBean {
  name?: string
  isSelected: boolean
}

export class SearchTextBean2 implements SearchTextBean {
  name: string = ''
  isSelected: boolean = false

  // constructor(name: string, isSelected: boolean = false) {
  //   this.name = name
  //   this.isSelected = isSelected
  // }
}
// 初始化
let item: SearchTextBean = { name: 'text', isSelected: false }
let item2: SearchTextBean2 = { name: 'text', isSelected: false }

ii. class 实现构造方法, 使用 new 初始化

export interface SearchTextBean {
  name?: string
  isSelected: boolean
}

export class SearchTextBean2 implements SearchTextBean {
  name: string = ''
  isSelected: boolean = false

  constructor(name: string, isSelected: boolean = false) {
     this.name = name
     this.isSelected = isSelected
  }
}
// 初始化
let item: SearchTextBean = { name: 'text', isSelected: false }
let item3: SearchTextBean2 = new SearchTextBean2('test', false)

2. @Builder state 无法刷新

image.png

@State safetyBean: SearchTextBean = { name: 'TEST', isSelected: false }

build() {
  Column() {
    this.textCell(this.safetyBean)
  }
}

@Builder
textCell(item: SearchTextBean) {
  Row() {
    Text(item.name)
      .fontSize(13)
      .fontColor(item.isSelected ? '#999999' : '#505050')
      .height(40)
      .padding({ left: 12 })
      .layoutWeight(1)

    Image($r('app.media.goods_list2_check'))
      .width(16)
      .height(12)
      .visibility(item.isSelected ? Visibility.Visible : Visibility.Hidden)
      .margin({ right: 12 })
  }
  .onClick(() => {
    let bean = this.safetyBean
    bean.isSelected = !bean.isSelected
    this.safetyBean = bean
  })
}

解决方法: 参数改为 按应用传递? 官方示例似乎没有区别 解决方法2:改为自定义组件,传递参数

image.png

image.png

3. @ObjectLink

对于@Observed装饰的类, 需要使用 new 初始化