如果在一个组件中有一个模型数组,把模型数组传递给子组件,如何做到在父组件中修改模型数组中一个元素

如果在一个组件中有一个模型数组,把模型数组传递给子组件,如何做到在父组件中修改模型数组中一个元素,去刷新ui


HarmonyOS
2024-05-07 21:08:49
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
put_get

@State只能监听到一层,对于嵌套属性值得改变无法监听,所以页面无法更新,ArkUI中提供了@ObjectLink和@Observed类装饰器用于在涉及嵌套对象或数组的场景中进行双向数据同步:https://developer.huawei.com/consumer/cn/doc/harmonyos-guides/arkts-observed-and-objectlink-0000001774279618

参考以下demo:

@Observed 
class Model1 { 
text: string; 
color: ResourceColor 
 
constructor(text: string, color: ResourceColor) { 
this.text = text 
this.color = color 
} 
} 
 
@Component 
struct SubView { 
// @Link models: Model1[] 
@ObjectLink model: Model1; 
build() { 
Row() { 
Column() { 
Text(this.model.text) 
.backgroundColor(this.model.color) 
} 
} 
} 
} 
 
@Entry 
@Component 
struct Test1 { 
@State models: Model1[] = [new Model1(“hello world”, Color.Red)] 
 
build() { 
Row() { 
Column() { 
ForEach(this.models, (item: Model1, index: number) => { 
SubView({ model: item }) 
}, (item: Model1, index: number) => { 
return index.toString() 
}) 
Button(‘Test view: clicked here’) 
.onClick(() => { 
// 下面两行都无法刷新ui 
this.models[0].color = Color.Blue 
// this.models = [new Model1(“hello world”, Color.Blue)] 
}) 
 
}.width(‘100%’) 
}.height(‘100%’) 
} 
}

并不是状态变量的所有更改都会引起UI的刷新,只有可以被框架观察到的修改才会引起UI刷新。该链接介绍了什么样的修改才能被观察到,以及观察到变化后,框架的是怎么引起UI刷新的,即框架的行为表现是什么。https://developer.huawei.com/consumer/cn/doc/harmonyos-guides/arkts-state-0000001774279614#ZH-CN_TOPIC_0000001774279614__观察变化和行为表现"

分享
微博
QQ
微信
回复
2024-05-08 15:20:31
相关问题
如何判断一个数组不为空?
544浏览 • 1回复 待解决
Stage模型如何开发一个服务卡片
2433浏览 • 1回复 待解决
如何判断一个对象是否在对象数组
2457浏览 • 1回复 待解决
如何实现一个折叠组件
998浏览 • 1回复 待解决
HarmonyOS 需要一个图片预览组件
297浏览 • 1回复 待解决
实现一个虚线边框的组件
582浏览 • 1回复 待解决
Web组件如何发起一个下载任务?
453浏览 • 1回复 待解决