HarmonyOS鸿蒙学习笔记（12）@Link的作用

通过HarmonyOS鸿蒙学习笔记（5）@State作用说明和简单案例一文我们知道@State修饰的变量发生变化时，会刷新相关页面更新UI。如果是子组件想要改变父组件的状态从而刷新UI改怎么办呢？比如如下代码：

如上图代码：PlayButton组件是Player组件的子组件，Player是父组件。我们的意图是在PlayButton组件中点击播放或者暂停按钮，父组件Player的Text文本信息随着改变。用来模拟播放器的播放和暂停效果。虽然父组件Player的isPlaying组件使用了@State修饰，但是子组件PlayButton此时点击是没有效果的，父组件Player的Text并没有变化。那么怎么解决这一问题呢？此时@Link的作用就显现了出来。上图代码只需要做两处修改即可：

1、将PlayButton的buttonPlaying变量用@Link修饰。

@Component
struct PlayButton {@Link buttonPlaying: boolean
}

2、在初始化PlayButton组件需要将 PlayButton({buttonPlaying: this.isPlaying})改成PlayButton({buttonPlaying: $isPlaying})，即用@Link修饰的变量初始化的时候，需要用$修饰。

详细代码见@Link官方文档

事实上使用 @Consume和@Provide也可以达到上述效果，只不过代码要进行相关改造，改造如下：

总结，也就是说当开发者需要在子组件中针对父组件的一个变量（parent_a）设置双向同步时，开发者可以在父组件中使用@State装饰变量（parent_a），并在子组件中使用@Link装饰相应的变量（child_a）。这样的话，不仅可以实现父组件与单个子组件之间的数据同步，也可以实现父组件与多个子组件之间的数据同步。如下图所示，可以看到，父子组件针对ClassA类型的变量设置了双向同步，那么当子组件1中变量的属性c的值变化时，会通知父组件同步变化，而当父组件中属性c的值变化时，会通知所有子组件同步变化。（结论来源）

参考资料：
HarmonyOS鸿蒙学习笔记（5）@State作用说明和简单案例
@Link官方文档

HarmonyOS鸿蒙学习笔记（12）@Link的作用相关推荐

HarmonyOS鸿蒙学习笔记（2）路由ohos.router的使用
ohos.router路由入门指南前言路由跳转传递和接收参数参考资料前言本文以eTS-3.1.6.6位版本来说明ohos.router的使用,重点来说明ohos.router怎么传递和接收参 ...
HarmonyOS鸿蒙学习笔记（11）Flex组件alignItems属性说明
Flex组件alignItems属性 1.代码示例 2.FlexDirection.Row情况下各个ItemAlign的运行情况. 2.1.alignItems:ItemAlign.Auto的运行效果 ...
软件测试工程师学习笔记12 - 数据库篇
软件测试工程师学习笔记 -12 一.入门必读二.Linux 三.数据库 1.MySQL基础 1)别名与重复记录 2)条件查询 3)聚合函数 4)数据分组 5)一个练习 6)分组后的数据筛选 7)数据 ...
Linux学习笔记12——配置ftp、squid、Tomcat、Samba、MySQL主从
Linux学习笔记12 Linux学习笔记12 配置FTP服务配置pure-ftpd 开机启动上传下载文件配置vsftpd CentOS 70安装配置Vsftp服务器搭好vsftp之后出现55 ...
golang学习笔记12 beego table name `xxx` repeat register, must be unique 错误问题
golang学习笔记12 beego table name `xxx` repeat register, must be unique 错误问题今天测试了重新建一个项目生成新的表,然后复制到旧的项目 ...
HALCON 20.11：深度学习笔记(12)---语义分割
HALCON 20.11:深度学习笔记(12)--- 语义分割 HALCON 20.11.0.0中,实现了深度学习方法. 本章解释了如何使用基于深度学习的语义分割,包括训练和推理阶段. 通过语义分割, ...
台大李宏毅Machine Learning 2017Fall学习笔记 (12)Why Deep?
台大李宏毅Machine Learning 2017Fall学习笔记 (12)Why Deep? 本博客整理自: http://blog.csdn.net/xzy_thu/article/detail ...
Kotlin学习笔记12——数据类和密封类
Kotlin学习笔记12--数据类和密封类前言数据类在类体中声明的属性复制 componentN 解构声明密封类尾巴前言上一篇,我们学习了Kotlin中的拓展,今天继续来学习Kotli ...
R语言小白学习笔记12—概率分布
R语言小白学习笔记12-概率分布笔记链接学习笔记12-概率分布 12.1 正态分布 12.2 二项分布 12.3 泊松分布 12.4 其他分布笔记链接学习笔记1-R语言基础. 学习笔记2-高级 ...

HarmonyOS鸿蒙学习笔记（12）@Link的作用

HarmonyOS鸿蒙学习笔记（12）@Link的作用相关推荐

最新文章

热门文章