HarmonyOS监听组件参数变化，未变更问题

代码如下：

@Observed 
export class NavigationBarButtonModel { 
  icon?: ResourceStr 
  iconSize?: Length 
  text?: ResourceStr 
  textSize?: Length 
  textColor?: ResourceColor 
  onClick?: (event?: ClickEvent) => void 
  tag?: string 
  constructor() 
  constructor(onClick: (event?: ClickEvent) => void) 
  constructor(onClick: (event?: ClickEvent) => void, icon: ResourceStr) 
  constructor(onClick: (event?: ClickEvent) => void, icon: ResourceStr, iconSize: Length) 
  constructor(onClick?: (event?: ClickEvent) => void, icon?: ResourceStr, iconSize?: Length) { 
    this.onClick = onClick 
    this.icon = icon 
    this.iconSize = iconSize ?? "22vp" 
    this.textSize = "22fp" 
    this.textColor = "#fff000" 
  } 
} 
@Component 
struct NavigationBarButton { 
  @ObjectLink @Watch('onChangeModel') model: NavigationBarButtonModel 
  private clickEvent?: (event?: ClickEvent) => void 
  @Prop text: string 
  build() { 
    Row() { 
      if(this.model.icon) { 
        Image(this.model.icon) 
          .width(this.model.iconSize ?? "22vp") 
          .height(this.model.iconSize ?? "22vp") 
          .objectFit(ImageFit.Contain) 
      }else if(this.model.text) { 
        Text(this.model.text) 
          .fontSize(this.model.textSize ?? "22fp") 
          .fontColor(this.model.textColor ?? "22fp") 
          .titleStyle() 
      } 
    } 
    .width("46vp") 
    .height("46vp") 
    .justifyContent(FlexAlign.Center) 
    .onClick(this.clickEvent ?? (() => {})) 
  } 
  onChangeModel() { 
    if(this.clickEvent !== this.model.onClick) { 
      this.clickEvent = this.model.onClick 
    } 
  } 
  aboutToAppear() { 
    this.clickEvent = this.model.onClick; 
  } 
}

引入组件NavigationBarButton({model: model})；

第一次修改构造一个model，修改 icon，onclick，组件渲染，触发aboutToAppear，没触发onChangeModel，点击 button，触发 onclick 事件。

第二次修改 model，只修改model的onClick，并没有触发aboutToAppear，也没触发onChangeModel，点击 button，触发的是 onclick 第一次的事件。

在第二次只修改model的 onClick时，如何操作，点击button触发的是第二次的 click 事件？为什么不触发onChangeModel事件？

HarmonyOS

superinsect

2024-08-09 11:30:09

浏览

回答 1

待解决

回答 1

按赞同

按时间

FengTianYa

首先aboutToAppear()事件是放在build()事件之前执行的；其次，观察到代码中并没有对this.model这个对象做重新赋值，所以没有触发到onChangeModel事件。demo里面是触发NavigationBarButtonA中的onClick事件，触发NavigationBarButton中的onChangeModel事件。

在NavigationBarButton中onClick事件可做如下更改：

.onClick(this.clickEvent ?? (() => { 
  if (this.clickEvent) { 
    // this.clickEvent; 
    console.log("11111") 
  } 
  else { 
    console.log("22222") 
  } 
}))

2024-08-09 17:40:00

如何写精华回答，获更多曝光？

发布

51CTO

51CTO博客

51CTO学堂

HarmonyOS监听组件参数变化，未变更问题

订阅鸿蒙技术特刊，精选内容抢先看