HarmonyOSNEXT—应用通信之EventHub

xianwlg

HarmonyOSNEXT—应用通信之EventHub

序言

在应用开发过程中，我们对于应用中数据和响应事件的传递，都会选择不同的通信方式，在选择这些通信方式时，我们需要考虑不同通信方式下我们的实现逻辑，以及是否满足我们的需求，本文主要介绍，应用基于同一个上下文的通信方式
一、基于Ability的通信方式——EventHub

简介：

EventHub通过Ability实例的上下文对象来获取，主要用于同一Ability下的组件间通信，属于一种轻量级的通信方式，主要用于无复杂序列化开销的场景。
使用方式：

EventHub是基于订阅和发布的方式来触发事件响应的：

1. // 订阅事件
2. getContext().eventHub.on("click" , (param: string) => {
3.   console.log("Index eventhub message: " +  param);
4.   this.message = param
5. })

复制代码

1. // 发布事件
2. getContext().eventHub.emit('click', "TestEventHubPage")

复制代码

1. // 取消订阅
2. getContext().eventHub.off("click")

复制代码

注意事项：取消订阅时，如果不传入callback，将取消所有订阅当前事件的回调
二、项目示例：

通过不同弹框的点击功能，在同一个页面中通过eventHub来传递弹框中的事件，主要作用是，多个页面的不同类型弹框，可以进行统一处理

1. // index.ets
2. import { TestDialog1 } from './component/TestDialog1';
3. import { TestDialog2 } from './component/TestDialog2';
5. @Entry
6. @Component
7. struct Index {
8.   @State message: string = 'Hello World';
10.   dialogController1: CustomDialogController = new CustomDialogController({
11.     builder: TestDialog1(),
12.     alignment: DialogAlignment.Bottom,
13.     offset: { dx: 0, dy: -25 } })
15.   dialogController2: CustomDialogController = new CustomDialogController({
16.     builder: TestDialog2(),
17.     alignment: DialogAlignment.Bottom,
18.     offset: { dx: 0, dy: -25 } })
20.   aboutToAppear(): void {
21.     getContext().eventHub.on("clickEvent" , (id: number, param: string) => {
22.       console.log("Index eventhub message: " +  param);
23.       switch (id) {
24.         case 0:
25.           if (param != "close") {
26.             this.message = param
27.           } else {
28.             this.dialogController1.close()
29.           }
30.           break;
31.         case 1:
32.           if (param != "close") {
33.             this.message = param
34.           } else {
35.             this.dialogController2.close()
36.           }
37.           break;
38.       }
39.     })
40.   }
42.   build() {
43.     Column({space: 20}) {
44.       Text(this.message).fontSize(50).fontWeight(FontWeight.Bold).margin({top: 50})
45.       Button("第一个弹框")
46.         .fontSize(50)
47.         .fontWeight(FontWeight.Bold)
48.         .onClick(() => {
49.           this.dialogController1.open()
50.         })
51.       Button("第二个弹框")
52.         .fontSize(50)
53.         .fontWeight(FontWeight.Bold)
54.         .onClick(() => {
55.           this.dialogController2.open()
56.         })
57.     }
58.     .height('100%')
59.     .width('100%')
60.   }
61. }
63. // TestDialog1.ets
64. import { common } from "@kit.AbilityKit"
66. @CustomDialog
67. export struct TestDialog1 {
68.   controller: CustomDialogController
69.   eventHub: common.EventHub = getContext().eventHub
70.   // 间距
71.   @State column_space: number = 35
73.   build() {
74.     Column({ space: this.column_space }) {
75.       Text("dialogText1").fontSize(25)
76.       Button("点击1").onClick(() => {
77.         this.emitData("第一个dialog点击触发")
78.       })
79.       Button("关闭dialog1").onClick(() => {
80.         this.emitData("close")
81.       })
82.     }
83.     .width('100%')
84.     .alignItems(HorizontalAlign.Center)
85.   }
86.   /**
87.    * 发送dialog事件
88.    */
89.   private emitData(param: string) {
90.     this.eventHub.emit('clickEvent', 0, param)
91.   }
92. }
94. // TestDialog2.ets
95. import { common } from "@kit.AbilityKit"
97. @CustomDialog
98. export struct TestDialog2 {
99.   controller?: CustomDialogController
100.   eventHub: common.EventHub = getContext().eventHub
101.   // 间距
102.   @State column_space: number = 35
104.   build() {
105.     Column({ space: this.column_space }) {
106.       Text("dialogText2").fontSize(25)
107.       Button("点击2").onClick(() => {
108.         this.emitData("第二个dialog点击触发")
109.       })
110.       Button("关闭dialog2").onClick(() => {
111.         this.emitData("close")
112.       })
113.     }
114.     .id('deleteAlertDialog_Column')
115.     .width('100%')
116.     .alignItems(HorizontalAlign.Center)
117.   }
118.   /**
119.    * 发送dialog事件
120.    */
121.   private emitData(param: string) {
122.     this.eventHub.emit('clickEvent', 1, param)
123.   }
124. }

复制代码