实现页面之间通讯的方法，无非就是把方法订阅（监听）在小程序全局状态下,然后在业务场景中发布(执行)，这里写了一个事件类 订阅 发布 销毁。
废话不多说直接上代码看
//event.js
class Event {
/** on 方法把订阅者所想要订阅的事件及相应的回调函数记录在 Event 对象的 _cbs 属性中*/
on(event, fn) {
if (typeof fn != "function") {
console.error('fn must be a function')
return
}
this._cbs = this._cbs || {};
(this._cbs[event] = this._cbs[event] || []).push(fn)
}
/**emit 方法接受一个事件名称参数，在 Event 对象的 _cbs 属性中取出对应的数组，并逐个执行里面的回调函数 */
emit(event) {
this._cbs = this._cbs || {}
var callbacks = this._cbs[event], args
if (callbacks) {
callbacks = callbacks.slice(0)
args = [].slice.call(arguments, 1)
for (var i = 0, len = callbacks.length; i < len; i++) {
callbacks[i].apply(null, args)
}
}
}
/** off 方法接受事件名称和当初注册的回调函数作参数，在 Event 对象的 _cbs 属性中删除对应的回调函数。*/
off(event, fn) {
this._cbs = this._cbs || {}
// all
if (!arguments.length) {
this._cbs = {}
return
}
var callbacks = this._cbs[event]
if (!callbacks) return
// remove all handlers
if (arguments.length === 1) {
delete this._cbs[event]
return
}
// remove specific handler
var cb
for (var i = 0, len = callbacks.length; i < len; i++) {
cb = callbacks[i]
if (cb === fn || cb.fn === fn) {
callbacks.splice(i, 1)
break
}
}
return
}
}
export default Event
//app.js
import Event form event.js
//挂载到wx的实例上
wx.event=new Event()
使用方法如下:
//a页面 a.js page
page{
onload(){
//订阅
wx.event.on('testFunc',(e)=>{
console.log(e)//{id:1}
console.log('订阅事件')
})
}
}
//b页面 b.js page
page{
showEvent(){
//发布
wx.event.emit('testFunc',{id:1})
}
}
