当前位置: 首页 > news >正文

微信小程序,事件总线(Event Bus) 实现

1、util.js文件

/*** 事件总线*/
function createEventBus() {// 私有事件存储对象,通过闭包保持私有性const events = {};return {/*** 监听事件,只执行一次* @param {string} eventName - 事件名称* @param {Function} callback - 回调函数*/once(eventName, callback) {const onceCallback = (...args) => {callback(...args);this.off(eventName, onceCallback);};this.on(eventName, onceCallback);},/*** 监听事件* @param {string} eventName - 事件名称* @param {Function} callback - 回调函数*/on(eventName, callback) {if (!events[eventName]) {events[eventName] = [];}events[eventName].push(callback);},/*** 触发事件* @param {string} eventName - 事件名称* @param {...any} args - 传递给回调的参数*/emit(eventName, ...args) {const callbacks = events[eventName];if (callbacks) {// 复制数组防止回调中修改原数组callbacks.slice().forEach(callback => {callback(...args);});}},/*** 移除事件监听* @param {string} eventName - 事件名称* @param {Function} [callback] - 可选,指定要移除的回调函数*/off(eventName, callback) {const callbacks = events[eventName];if (callbacks) {if (callback) {// 过滤掉指定的回调函数events[eventName] = callbacks.filter(cb => cb !== callback);} else {// 移除整个事件的所有监听delete events[eventName];}}}};
}// 创建事件总线实例
const eventBus = createEventBus();module.exports = {eventBus: eventBus,
}

2、如何使用

const util = require("../../../utils/util.js");//生命周期函数--监听页面加载onLoad: function (options) {const that = this;// 监听事件,只一次util.eventBus.once('aaUpdate', (data) => {console.log(data)});// 监听事件,多次util.eventBus.on('aaUpdate', (data) => {console.log(data)});},// 触发事件saomaHexiao: function () {var that = this;// 触发事件util.eventBus.emit('aaUpdate', {code: 200,message: 'ok'});},

http://www.dtcms.com/a/343981.html

相关文章:

  • Git 提交除某个文件外的其他所有文件
  • linux搭建本地yum源仓库
  • windows安装Elasticsearch,ik分词器,kibana可视化工具
  • Go初级二
  • 集群与负载均衡:HAProxy 与 Nginx 实践
  • 第41周——人脸图像生成
  • Java 性能优化实战(三):并发编程的 4 个优化维度
  • 第3课:Flutter基础组件
  • 上海人工智能实验室开源基于Intern-S1同等技术的轻量化开源多模态推理模型
  • WPF MVVM入门系列教程(TabControl绑定到列表并单独指定每一页内容)
  • 【nl2sql综述】2025最新综述解读
  • RAG学习(五)——查询构建、Text2SQL、查询重构与分发
  • Docker 部署 Microsoft SQL Server 指南
  • 第10课:性能优化
  • 如何将照片从iPhone传输到Mac?
  • 如何将文件从 iPad 转移到 iPhone 16/15
  • Node.js 开发 JavaScript SDK 包的完整指南(AI)
  • Cloudflare + nginx 限制ip访问的几种方式(白嫖cloudflare的ip数据库)
  • 数据分类分级的概念、标准解读及实现路径
  • 新零售“实—虚—合”逻辑下定制开发开源AI智能名片S2B2C商城小程序的机遇与演进
  • TCP/UDP详解(一)
  • 高并发的 Spring Boot Web 项目注意点
  • HTTP代理与SOCKS代理的区别、应用场景与选择指南
  • Figma 开源替代品 Penpot 安装与使用
  • 要区分一张图片中的网状图(如网格结构或规则纹理)和噪点(随机分布的干扰像素),比如电路的方法 计算机视觉
  • Unreal Engine ClassName Rule
  • HTTP接口鉴权方式
  • Java面试实战系列【并发篇】- CompletableFuture异步编程实战
  • Node.js中Express框架入门教程
  • vue/react使用h5player对接海康ws视频流实时播放,监控回放