微信小程序-通知廣播WxNotificationCenter(應(yīng)用粪般、解析)

以下兩種場景黎泣,在微信小程序官方并沒有提供類似iOS的NSNotificationCenter 或者 Android的廣播類似的解決方案件炉。

  1. A頁面 -> B頁面纫事,B頁面完成相關(guān)邏輯需要通知A頁面刷新數(shù)據(jù)(并傳值)
  2. 通知(廣播)已入棧并且注冊過通知的頁面(并傳值)
一、如果遇到以上的場景览露,要怎么處理呢荧琼?

在github上發(fā)現(xiàn)了WxNotificationCenter,下載地址: https://github.com/icindy/WxNotificationCenter WxNotificationCenter借鑒iOS開發(fā)中的NSNotificationCenter的消息模式進(jìn)行開發(fā)
簡單的說WxNotificationCenter是實(shí)現(xiàn)大跨度的通信機(jī)制,可以為兩個無引用關(guān)系的兩個對象進(jìn)行通信铭腕,即事件發(fā)出者和響應(yīng)者可以沒有任何耦合關(guān)系。

二多糠、讓我們看看代碼中的使用
  1. 獲取到 WxNotificationCenter 將WxNotificationCenter.js文件加入項(xiàng)目目錄下
  2. 頁面中導(dǎo)入
    var WxNotificationCenter = require('../../../vendors/WxNotificationCenter.js')
  3. A頁面的Page生命周期中注冊累舷、移除通知,及接收通知后響應(yīng)的fuction
onLoad: function () {
    //注冊通知
    var that = this
    WxNotificationCenter.addNotification('NotificationName', that.didNotification, that)    
  },

  onUnload: function () {
    //移除通知
    var that = this
    WxNotificationCenter.removeNotification('NotificationName', that)
  },

 //通知處理
  didNotification: function () {
    //更新數(shù)據(jù)
    this.setData({
          
    })
  },
  1. B頁面處理完邏輯夹孔,發(fā)送通知
//發(fā)送通知(所有注冊過'NotificationName'的頁面都會接收到通知)
WxNotificationCenter.postNotificationName('NotificationName')
三被盈、如何傳值?

obj 為字符串 或者 對象

  1. WxNotificationCenter.postNotificationName('NotificationName',obj)
  2. WxNotificationCenter.addNotification('NotificationName', that.didNotification, that)
  didNotification: function (obj) {
     //拿到值obj
    
  },

四搭伤、源碼解析
  1. 全部源碼只有WxNotificationCenter.js一個文件只怎,通過以下方式引用該文件:
var WxNotificationCenter = require('../../vendors/WxNotificationCenter.js')
  1. 源碼對外開放三個方法:
module.exports = {
    addNotification: addNotification,
    removeNotification: removeNotification,
    postNotificationName: postNotificationName
}
  1. 核心源碼
var __notices = [];
var newNotice = {
       name: name,                  //注冊名,一般let在公共類中
       selector: selector           //對應(yīng)的通知方法怜俐,接受到通知后進(jìn)行的動作
       observer: observe            //注冊對象身堡,指Page對象 
};

沒錯,只有一個數(shù)組拍鲤! 操作一個對象贴谎!
核心思想很簡單,就是利用一個數(shù)組緩存對象季稳,通過設(shè)置name和注冊對象來確定需要通知或者廣播的對象擅这,并監(jiān)聽通知方法
首先Page對象中調(diào)用addNotification(name, selector, observer)方法,將newNotice對象push進(jìn)數(shù)組__notices(可以重復(fù)加入)景鼠;

__notices.push(newNotice);

然后postNotificationName(name, info)方法仲翎,將數(shù)組__notices中的對象遍歷出來,notice.name === name符合該要求的對象執(zhí)行notice.selector(info);

for (var i = 0; i < __notices.length; i++){
      var notice = __notices[i];
      if(notice.name === name){
        notice.selector(info);
      }
    }

最后釋放內(nèi)存铛漓,根據(jù)各自的業(yè)務(wù)邏輯溯香,調(diào)用removeNotification(name,observer) 將對應(yīng)的對象從數(shù)組中移除:

if(notice.name === name){
        if(notice.observer === observer){
            __notices.splice(i,1);
            return;
        }
      }

自己寫了個Demo,感興趣的可以拉一下 https://github.com/hanqingman/WxNotificationCenter-Demo

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末票渠,一起剝皮案震驚了整個濱河市逐哈,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌问顷,老刑警劉巖昂秃,帶你破解...
    沈念sama閱讀 216,470評論 6 501
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異杜窄,居然都是意外死亡肠骆,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,393評論 3 392
  • 文/潘曉璐 我一進(jìn)店門塞耕,熙熙樓的掌柜王于貴愁眉苦臉地迎上來蚀腿,“玉大人,你說我怎么就攤上這事±蚋疲” “怎么了廓脆?”我有些...
    開封第一講書人閱讀 162,577評論 0 353
  • 文/不壞的土叔 我叫張陵,是天一觀的道長磁玉。 經(jīng)常有香客問我停忿,道長,這世上最難降的妖魔是什么蚊伞? 我笑而不...
    開封第一講書人閱讀 58,176評論 1 292
  • 正文 為了忘掉前任席赂,我火速辦了婚禮,結(jié)果婚禮上时迫,老公的妹妹穿的比我還像新娘颅停。我一直安慰自己,他們只是感情好掠拳,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,189評論 6 388
  • 文/花漫 我一把揭開白布癞揉。 她就那樣靜靜地躺著,像睡著了一般碳想。 火紅的嫁衣襯著肌膚如雪烧董。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 51,155評論 1 299
  • 那天胧奔,我揣著相機(jī)與錄音逊移,去河邊找鬼。 笑死龙填,一個胖子當(dāng)著我的面吹牛胳泉,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播岩遗,決...
    沈念sama閱讀 40,041評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼扇商,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了宿礁?” 一聲冷哼從身側(cè)響起案铺,我...
    開封第一講書人閱讀 38,903評論 0 274
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎梆靖,沒想到半個月后控汉,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,319評論 1 310
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡返吻,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,539評論 2 332
  • 正文 我和宋清朗相戀三年姑子,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片测僵。...
    茶點(diǎn)故事閱讀 39,703評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡街佑,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情沐旨,我是刑警寧澤森逮,帶...
    沈念sama閱讀 35,417評論 5 343
  • 正文 年R本政府宣布,位于F島的核電站磁携,受9級特大地震影響吊宋,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜颜武,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,013評論 3 325
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望拖吼。 院中可真熱鬧鳞上,春花似錦、人聲如沸吊档。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,664評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽怠硼。三九已至鬼贱,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間香璃,已是汗流浹背这难。 一陣腳步聲響...
    開封第一講書人閱讀 32,818評論 1 269
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留葡秒,地道東北人姻乓。 一個月前我還...
    沈念sama閱讀 47,711評論 2 368
  • 正文 我出身青樓,卻偏偏與公主長得像眯牧,于是被迫代替她去往敵國和親蹋岩。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,601評論 2 353

推薦閱讀更多精彩內(nèi)容

  • 轉(zhuǎn)至元數(shù)據(jù)結(jié)尾創(chuàng)建: 董瀟偉学少,最新修改于: 十二月 23, 2016 轉(zhuǎn)至元數(shù)據(jù)起始第一章:isa和Class一....
    40c0490e5268閱讀 1,709評論 0 9
  • NSNotificationCenter對象(通知中心)提供了在程序中廣播消息的機(jī)制剪个,它實(shí)質(zhì)上就是一個通知分發(fā)表。...
    9de75b652cd9閱讀 751評論 0 1
  • Spring Cloud為開發(fā)人員提供了快速構(gòu)建分布式系統(tǒng)中一些常見模式的工具(例如配置管理版确,服務(wù)發(fā)現(xiàn)扣囊,斷路器,智...
    卡卡羅2017閱讀 134,651評論 18 139
  • iOS 提供了一種 “同步的” 消息通知機(jī)制NSNotificationCenter阀坏,觀察者只要向消息中心注冊如暖, ...
    MasterChen閱讀 2,208評論 4 16
  • 小聰站在路燈下面盒至,望著23樓的燈火通明,手里擰著宋航最愛的十三香小龍蝦,冷掉的油碰在大拇指上枷遂,粘粘的很不好受∮V裕現(xiàn)在...
    石墻酒館閱讀 592評論 1 2