美文网首页
小程序多个页面监听某个值的变化EventBus

小程序多个页面监听某个值的变化EventBus

作者: hao_developer | 来源:发表于2024-04-11 09:57 被阅读0次

EventBus.js

//创建EventBus对象
let EventBus = function () {
  console.log("eventbus init...");
};
//准备数组容器
var arrbus = [];
//添加方法
EventBus.prototype = {
  emit: function (key, data) {
    let list = arrbus[key];
    if (list == null) return;
    let len = list.length - 1;
    //反向遍历,防止在订阅者在回调中移除自身带来的下标错位
    for (var i = len; i > -1; --i) {
      list[i](data);
    }
  },
  off: function (key, action) {
    let list = arrbus[key];
    if (key == null || list == null) return;
    if (action == null) {
      arrbus[key] = null;
    } else {
      let actionIndex = arrbus[key].indexOf(action)
      arrbus[key].splice(actionIndex,1)
    }
  },
  on: function (key, action) {
    if (key == null || action == null) return;
    if (!arrbus[key]) {
      arrbus[key] = []
    }
    arrbus[key].push(action);
  },
}
var eventBus = new EventBus()
module.exports = {
  eventBus: eventBus
}

引入并使用

const EventBus = require('../utils/eventBus.js');

监听

EventBus.eventBus.on('childIndex', this.childIndexWatchBack)

发送

EventBus.eventBus.emit('childIndex', e.target.dataset.index)

取消某个监听

EventBus.eventBus.off('childIndex', this.childIndexWatchBack)

取消全部监听

EventBus.eventBus.off('childIndex')

相关文章

网友评论

      本文标题:小程序多个页面监听某个值的变化EventBus

      本文链接:https://www.haomeiwen.com/subject/nkbcxjtx.html