vue原理之发布订阅

vue的原理之发布订阅

// 1.创造构造函数

function EventEmitter(){

    // 对象形式的容器

    this.subs={}

}

// 2.定义方法用以订阅事件并处理数据

EventEmitter.prototype.$on = function(EventType,handler) {

/*  if(!this.subs[EventType]) {

     this.sbus[EventType] = []

 } */

 this.subs[EventType] = this.subs[EventType] || []

 this.subs[EventType].push(handler)

}

// 3.定义方法用以发布事件并传递数据

EventEmitter.prototype.$emit = function(EventType,...arr) {

    if(this.subs[EventType]) {

        this.subs[EventType].forEach(handler=>{

            handler.apply(this,arr)

        })

    }

}

// 4.创建实例对象

const EE = new EventEmitter()

// 5.订阅

EE.$on('click',function(val){

    console.log(val)

})

const val1 = 'a'

const val2 = 'b'

const val3 = 'c'

// 6.发布

EE.$emit('click',val1,val2,val3)

以上内容由南海风筝发布

发表评论

电子邮件地址不会被公开。 必填项已用*标注