小程序使用Events监听实现对数据的全局监听

文章介绍了一个简单的JavaScript类`Event`,用于实现事件监听、触发和卸载功能。`Event`类包含`on`、`emit`和`off`方法,分别用于添加监听器、触发事件和移除监听器。监听器的添加需要提供事件名称、回调函数以及可选的上下文,而卸载监听器则可以通过事件名称和标识来定位。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

 以下为监听方法

class Event {
  on(event, fn, ctx) {
    if (typeof fn != "function") {
      console.error('fn must be a function')
      return
    }
    this._stores = this._stores || {};
    (this._stores[event] = this._stores[event] || []).push({
      cb: fn,
      ctx: ctx
    })
  }
  emit(event) {
    this._stores = this._stores || {}
    var store = this._stores[event],
      args
    if (store) {
      store = store.slice(0)
      args = [].slice.call(arguments, 1)
      for (var i = 0, len = store.length; i < len; i++) {
        store[i].cb.apply(store[i].ctx, args)
      }
    }
  }
  off(event, fn, ctx) {
    this._stores = this._stores || {}
    // all
    if (!arguments.length) {
      this._stores = {}
      return
    }
    // specific event
    var store = this._stores[event]
    if (!store) return
    // remove all handlers
    if (arguments.length === 1) {
      delete this._stores[event]
      return
    }
    // remove specific handler
    var cb
    for (var i = 0, len = store.length; i < len; i++) {
      cb = store[i].cb
      if (store[i].ctx === ctx) {
        store.splice(i, 1)
        break
      }
    }
    return
  }
}
module.exports = {
  Event
}

 以下为使用方法

将events挂到全局对象上

wx.event = new Event();

监听开始,其中“监听名称”为需要监听的名称,可以用于多个地方监听;监听标识作用于卸载监听的唯一标识(全局唯一),如果不传监听标识,默认卸载的监听为第一个监听函数,出现多个相同“监听名称”会出现卸载错误的监听函数。

wx.event.on('监听名称', function (res) {
    //得到监听结果,执行函数操作
    
},'监听标识');

 卸载监听

wx.event.off("监听名称","监听标识");

 触发监听函数,object为监听函数接收到的内容

wx.event.emit('监听名称', object);

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值