zoukankan      html  css  js  c++  java
  • 03事件模型-发布订阅模式

    vue加入发布订阅模型:就是解耦

    发布订阅模式:(形式不限于函数,可以是函数或者对象等)

    中间的全局容器,用来存储可以被触发的东西(函数、对象)

    需要有一个方法,可以往容器里面传入东西(函数,对象等)

    需要有一个方法,可以将容器里面的东西取出来使用(函数调用,对象方法的调用)

    class Event {
      constructor() {
        this.list = {} //{key1:[f1,f2],key2:[]}
      }
      on(type, handler) {
        this.list[type] = (this.list[type] || []).concat(handler)
      }
      emit(type, ...data) {
        const fns = this.list[type]
        if (!fns || (!fns.length)) return false
        fns.forEach(fn => fn.apply(this, data))
      }
      off(type, handler) {
        const fns = this.list[type]
        if (!type && !handler) this.list = {}  // 移除所有事件 event.off() 删除所有事件 
        else if (!fns || !fns.length) return false //event.off('乱传的type')
        else if (type && !handler) {
          delete this.list[type] //event.off('click') //删除所有的click事件
        } else { //传入两个参数 event.off("click",handler)
          this.list[type] = fns.filter(fn => fn !== handler)
        }
    
      }
    }

  • 相关阅读:
    每日日报2021 3/14
    每日日报2021 3/13
    每日日报2021 3/12
    每日日报2021 3/11
    每日日报2021 3/10
    每日日报2021 3/9
    1678. Goal Parser Interpretation
    1694. Reformat Phone Number
    Amicable Pair (相亲数)
    454. 4Sum II
  • 原文地址:https://www.cnblogs.com/xiaoliziaaa/p/15017428.html
Copyright © 2011-2022 走看看