微信小程序,响应式监听全局函数

在utils下新建一个文件event.js,把下面的代码复制到该文件下

class Event {
on(event, fn, ctx) {
if (typeof fn != “function”) {
console.error(‘fn must be a function’)
return
}
this._stores = this._stores || {};
(this._stores[event] = this._stores[event] || []).push({ cb: fn, ctx: ctx })
}
emit(event) {
this._stores = this._stores || {}
var store = this._stores[event], args
if (store) {
store = store.slice(0)
args = [].slice.call(arguments, 1)
for (var i = 0, len = store.length; i < len; i++) {
store[i].cb.apply(store[i].ctx, args)
}
}
}
off(event, fn, ctx) {
this._stores = this._stores || {}
// all
if (!arguments.length) {
this._stores = {}
return
}
// specific event
var store = this._stores[event]
if (!store) return
// remove all handlers
if (arguments.length === 1) {
delete this._stores[event]
return
}
// remove specific handler
var cb
for (var i = 0, len = store.length; i < len; i++) {
cb = store[i].cb
if (store[i].ctx === ctx) {
store.splice(i, 1)
break
}
}
return
}
}
module.exports = {
Event
}

二,导入
在你需要的文件里导入(例如:在app.js文件导入)
import {Event} from ‘/utils/events.js’

三,实例化和发射事件
onShow: function() {
//实例化
wx.event = new Event()

//发射事件给消息页面监听
wx.event.emit('change', {})  //change是自定义的事件,{}是发射的参数

},
wx.event.emit(‘change’, {}) //change是自定义的事件,{}是发射的参数

四, 使用

onShow: function () {
//监听app.js发射的change事件,页面卸载的时候要停止监听event.off
wx.event.on(‘change’, function () {
that.setData({
messageNum: App.globalData.messageNum
})
})
},
五, 销毁监听
最好在页面销毁的时候停止监听,这样子可以节约性能,要不然就一直监听
// 生命周期函数–监听页面卸载
onUnload: function () {
//你监听的页面
wx.event.off(‘change’)
},