HarmonyOS 鸿蒙Next:@Observed修饰的class A 作为class B的属性,在Entry中使用@State修饰class B 对象,在UI中显示class A的属性,无法刷新
HarmonyOS 鸿蒙Next:@Observed修饰的class A 作为class B的属性,在Entry中使用@State修饰class B 对象,在UI中显示class A的属性,无法刷新
相关代码如下:
[@Entry](/user/Entry)
[@Component](/user/Component)
struct LinkTester {
[@State](/user/State) classB: LinkClassB = new LinkClassB("class B", new LinkClassA("A in B"))
build() {
Column() {
Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center }) {
this.nestClassLinkTester()
}
}
}
[@Builder](/user/Builder)
nestClassLinkTester() {
Text("====nest class start=====").textCommonStyleInLink()
Text(this.classB.classA.title).textCommonStyleInLink()
Button("change nest class").buttonCommonStyleInLink(() => {
this.classB.classA.title =
this.classB.classA.title == "A class from parent" ? "A class value" : "A class from parent"
})
NestClassChildPanel({ classB: this.classB })
Text("====nest class end=====").textCommonStyleInLink()
}
}
[@Component](/user/Component)
struct NestClassChildPanel {
[@Link](/user/Link) classB: LinkClassB
build() {
Column() {
Text("==== chld nest start=====").textCommonStyleInLink()
Text(this.classB.classA.title).textCommonStyleInLink()
Button("child change nest").buttonCommonStyleInLink(() => {
this.classB.classA.title = this.classB.classA.title == "A from child" ? "A child value" : "A from child"
})
Text("==== chld nest end=====").textCommonStyleInLink()
}
}
}
[@Extend](/user/Extend)(Text)
function textCommonStyleInLink() {
.fontSize(20).fontColor(Color.Blue)
}
[@Extend](/user/Extend)(Button)
function buttonCommonStyleInLink(event: (event: ClickEvent) => void) {
.backgroundColor(Color.Blue)
.fontColor(Color.White)
.backgroundColor(Color.Blue)
.onClick(event)
}
[@Observed](/user/Observed)
class LinkClassA {
title: string
constructor(title: string) {
this.title = title
}
}
class LinkClassB {
title: string
classA: LinkClassA
constructor(title: string, classA: LinkClassA) {
this.title = title
this.classA = classA
}
}
<button style="position: absolute; padding: 4px 8px 0px; cursor: pointer; top: 4px; right: 8px; font-size: 14px;">复制</button>
问题描述:
点击change nest class
Button时,关于this.classB.classA.title
显示的Text不会刷新,debug Button的点击事件是执行了的,请大家帮忙看一下原因。
3 回复
[@state](/user/state) + [@Link](/user/Link) 只能观察到对象第一层的修改,建议使用[@Observed](/user/Observed)+[@ObjectLink](/user/ObjectLink) 可以观测深层的修改
文档没读透,没了解清楚[@State](/user/State)刷新的限制,再看看[@Observed](/user/Observed)和[@ObjectLink](/user/ObjectLink)的关系才是搭配用的。
在HarmonyOS中,使用@Observed
和@State
进行数据绑定和响应式更新时,需要确保数据流的正确性和响应性。如果class A
的属性被@Observed
修饰,而class B
中的class A
实例被@State
修饰,理论上UI应该能够响应class A
属性的变化。
如果UI不刷新,可能的原因包括:
class A
的属性变化未正确触发通知。class B
中的class A
实例引用未正确更新。- UI组件未正确绑定到
class A
的属性。
检查这些方面,确保属性变化能被系统捕获并通知到UI。如果问题依旧没法解决请加我微信,我的微信是itying888。