Oberver.js

/*

    事件存放的倉庫

        多個事件
        每一個事件會對應多個事件函數

        aaa:[]
        haha:[]

    eventList:{
        key:[]
    }


    $on 事件綁定  eventName callback
        一個事件對應多個事件函數
        一、分析綁定的這個事件名稱在事件倉庫中是否存在 若是存在則直接將事件函數添加到數組中去
        二、若是不存在則建立一個數組而後將事件函數添加到數組中去

    $emit 事件的觸發  eventName params

        一、分析當前事件名稱是否存在,若是存在則遍歷數組中全部的事件進行觸發  將參數傳遞到數組中去


    $off  事件解綁  eventName callback
        1.分析當前事件名稱是否存在  若是存在則 判斷第二個參數是否存在  若是存在則 解綁對應的函數
        若是不存在則解綁所有

*/


let eventList = {

}


const $on = (eventName,callback)=>{
    if(!eventList[eventName]){
        eventList[eventName] = [];
    }

    eventList[eventName].push(callback);
}

const $emit = (eventName,params)=>{
    if(eventList[eventName]){
        eventList[eventName].forEach((cb)=>{
            cb(params);
        })
    }
}


const $off = (eventName,callback)=>{
    if(eventList[eventName]){
        if(callback){
            
            let index = eventList[eventName].indexOf(callback);
            eventList[eventName].splice(index,1);

        }else{
            eventList[eventName].length = 0;
        }
    }
}


export default {
    $on,
    $emit,
    $off
}
相關文章
相關標籤/搜索