「HarmonyOS」EventHub事件通知详细使用方法

需求背景:

在开发过程中,肯定会出现触发特定事件,需要全局进行通知,与之相关的部分进行执行相应的修改方法。举个例子:修改了用户个人昵称,需要进行全局通知,在涉及昵称的部分收到通知后,进行重新调用个人信息接口

EventHub模块介绍

在ArkTs中,EventHub提供这个对应功能,如下是在官方文档中的介绍:

EventHub模块提供了事件中心,提供订阅、取消订阅、触发事件的能力

实践操作

1.模块化处理

在官方文档中介绍,每次使用EventHub功能前,需要通过Ability实例的成员变量context获取, 所以为了简便使用方法,以及使用统一一个EventHub模块,所以我将其方法进行模块化处理

ArkTs 复制代码
/// EventHubUtil.ets
let context = getContext(this)
let eventhub = context.eventHub

export class EventHubUtil {
  /// 订阅事件
  static on(eventName: string, callback: Function) {
    eventhub.on(eventName, callback)
  }
  
  /// 取消订阅事件
  static off(eventName: string, callback?: Function) {
    eventhub.off(eventName, callback)
  }

  /// 触发事件
  static emit(eventName: string, ...params: Object[]) {
    eventhub.emit(eventName, params)
  }
}
2.订阅指定事件

在我需要订阅、监听指定事件是否发生时,具体操作方法:

ps:下方均以需要更新用户个人信息为例

在用户信息修改后,外部页面也需要进行更改用户信息的地方进行事件监听

ArkTs 复制代码
EventHubUtil.on('updateUserInfo', () => {this.requestUserInfo()})

EventHubUtil.on('withParams', this.LogParams})

LogParams(param1, param2) {
	console.log('LogParams is called,' + param1 + ',' + param2)
}

'updateUserInfo': 订阅事件名

() => {this.requestUserInfo():匿名函数,是在收到事件通知后,执行匿名函数对应内容方法

this.LogParams: 带参数自定义方法,收到事件通知后,获取对应参数,执行该方法

3.取消订阅指定事件

在页面销毁时,对应的订阅事件也需要进行销毁,以减少系统资源消耗

ArkTs 复制代码
aboutToDisappear() {
    EventHubUtil.off('updateUserInfo', () => {this.requestUserInfo()})

    EventHubUtil.off('withParams', this.LogParams})
}

LogParams(param1, param2) {
	console.log('LogParams is called,' + param1 + ',' + param2)
}

此处同理:

'updateUserInfo': 订阅事件名

() => {this.requestUserInfo():匿名函数

this.LogParams: 带参数自定义方法

4. 触发指定事件

在我需要进行触发指定事件时执行的方法

在例子中则为成功修改了用户信息时,进行触发指定事件,以达到通知其他订阅事件处进行信息修改

ArkTs 复制代码
// 修改用户个人信息请求
HttpApiManager.getInstance().updateUserInfo(new UserInfoBean(null, text))
  .then((data: UserInfoBean) => {
    this.userInfo = data
    // 触发更新用户信息事件
    EventHubUtil.emit('updateUserInfo')
    ToastUtil.getInstance().showToast('修改成功')

  })
  .catch(error => {
    ToastUtil.getInstance().showToast(error.message)
  })


// 带参数方法事件触发
EventHubUtil.emit('withParams', 111, 222)
EventHubUtil.emit('withParams', 111)
// 触发后数据打印:
'LogParams is called, 111, 222'
'LogParams is called, 111, undefined'

在触发事件处,简单写法只需填写对应的事件名称即可

在触发事件,也可以填写需传递的参数,在订阅事件处,则会以参数的方式传入对应callback方法

参考文档

EventHub官方文档地址

当前HarmonyOs仍在初步学习过程中,大家如果感兴趣或者有问题可以一起沟通交流 如果该文章对你有所帮助的话,可以点赞、收藏并关注一下!后续会持续更新更多技术内容

相关推荐
挣扎与觉醒中的技术人3 分钟前
【技术干货】三大常见网络攻击类型详解:DDoS/XSS/中间人攻击,原理、危害及防御方案
前端·网络·ddos·xss
zeijiershuai7 分钟前
Vue框架
前端·javascript·vue.js
写完这行代码打球去9 分钟前
没有与此调用匹配的重载
前端·javascript·vue.js
华科云商xiao徐9 分钟前
使用CPR库编写的爬虫程序
前端
狂炫一碗大米饭12 分钟前
Event Loop事件循环机制,那是什么事件?又是怎么循环呢?
前端·javascript·面试
IT、木易13 分钟前
大白话Vue Router 中路由守卫(全局守卫、路由独享守卫、组件内守卫)的种类及应用场景
前端·javascript·vue.js
顾林海14 分钟前
JavaScript 变量与常量全面解析
前端·javascript
程序员小续14 分钟前
React 组件库:跨版本兼容的解决方案!
前端·react.js·面试
乐坏小陈15 分钟前
2025 年你希望用到的现代 JavaScript 模式 【转载】
前端·javascript
生在地上要上天15 分钟前
从600行"状态地狱"到可维护策略模式:一次列表操作限制重构实践
前端