HarmonyOS开发实战：状态管理-@Event

最新推荐文章于 2024-08-26 14:21:33 发布

代码中的爱马仕

最新推荐文章于 2024-08-26 14:21:33 发布

阅读量644

点赞数 20

分类专栏：鸿蒙 HarmonyOS OpenHarmony 文章标签：前端 html harmonyos 华为鸿蒙数据库算法

本文链接：https://blog.csdn.net/dmzdams/article/details/140634515

版权

鸿蒙同时被 3 个专栏收录

187 篇文章 4 订阅

订阅专栏

OpenHarmony

185 篇文章 0 订阅

订阅专栏

HarmonyOS

181 篇文章 2 订阅

订阅专栏

按照一个组件最基本的功能，既能接收外部传入的数据，也要向外部传递数据。那么 @Event 修饰符就是来解决这个问题的了。

介绍

@Event 是子组件向父组件传递数据的技术，它只能用在 @ComponentV2 修改的组件上，其中的思想是

完成修改数据的操作，还是放在父组件内部，通过定义一个函数 func 来实现
在父组件调用子组件的时候，也顺带把这个函数 func 传递给子组件
子组件在内部使用 @Event 来修饰该函数，并且在需要的使用直接调用即可

父组件

定义内部数据 num
定义修改内部数据num的函数 func
使用子组件时，把num和func都传递过去

@Entry

@ComponentV2

struct Index {

@Local num: number = 100

// 自己定义的函数 负责修改数据， 该函数也要传递给子组件

func = (unit: number) => {

this.num -= unit

}

build() {

Column() {

Button("父组件 修改" + this.num)

.onClick(() => {

this.num++

})

// 使用子组件，并且传递数据 和 传递函数

Son({ num: this.num, func: this.func })

.padding(10)

}

.width("100%")

}

}

子组件

使用 @Param 接收父组件传递的 num
使用@Event 接收父组件传递的函数 func
定义点击事件的处理函数 onfunc，内部直接调用父组件传递过来的函数

@ComponentV2

struct Son {

@Param num: number = 0

@Event func: (num: number) => void = () => {

}

onfunc = () => {

this.func(5)

}

build() {

Column() {

Button(`子组件 ${this.num}`)

Button("子组件修改父组件中的状态")

.onClick(this.onfunc)

}

.border({

width: 1,

style: BorderStyle.Dashed

})

}

}

流程

@Once

@Once 和 @Param作用类似，都可以表示接收父组件传递过来的数据，但是也存在区别

@Once 只会接收第一次父组件传递过来的数据，后续父组件的数据修改，不会同步到 @Once修改的变量上
@Once 需要和 @Param 一起搭配使用，因为 @Param 修饰的是父组件传递给子组件的变量，该变量不能直接被修改。所以@Once修饰的变量，也不能在子组件内部直接修改。

@ComponentV2

struct Son {

@Once @Param num: number = 0

build() {

Column() {

Button(`子组件 ${this.num}`)

.onClick(() => {

this.num++ // 修改无效

})

}

.border({

width: 1,

style: BorderStyle.Dashed

})

}

}

@Entry

@ComponentV2

struct Index {

@Local num: number = 100

build() {

Column() {

Son({ num: this.num })

.padding(10)

}

.width("100%")

}

}

总结

@Param 表示父组件传递给子组件的数据，当父组件修改了，子组件会跟随响应，同时子组件内部不能直接修改 @Param修饰的变量
@Event 表示子组件想要修改父组件数据的一种技术，它用来修改函数，该函数是由父组件定义和传递给子组件的
@Once 必须和 @Param 搭配使用，表示父组件传递过来的数据，只会第一次生效。

最后

有很多小伙伴不知道学习哪些鸿蒙开发技术？不知道需要重点掌握哪些鸿蒙应用开发知识点？而且学习时频繁踩坑，最终浪费大量时间。所以有一份实用的鸿蒙（HarmonyOS NEXT）资料用来跟着学习是非常有必要的。

点击领取→【纯血版鸿蒙全套最新学习资料】（安全链接，放心点击）希望这一份鸿蒙学习资料能够给大家带来帮助，有需要的小伙伴自行领取，限时开源，先到先得~无套路领取！！

这份鸿蒙（HarmonyOS NEXT）资料包含了鸿蒙开发必掌握的核心知识要点，内容包含了（ArkTS、ArkUI开发组件、Stage模型、多端部署、分布式应用开发、音频、视频、WebGL、OpenHarmony多媒体技术、Napi组件、OpenHarmony内核、（南向驱动、嵌入式等）鸿蒙项目实战等等）鸿蒙（HarmonyOS NEXT）技术知识点。

鸿蒙（HarmonyOS NEXT）最新学习路线