借助一个 weapp-event 的第三方插件可以轻松实现小程序跨页面通信
原作者的这个插件有时候会出现发送两次的问题,为此我改良了一下
改良版 Link to heading
在发射事件里面添加了一个判断来检测
var events = {};
function on(name, self, callback) {
var tuple = [self, callback];
var callbacks = events[name];
if (Array.isArray(callbacks)) {
callbacks.push(tuple);
}
else {
events[name] = [tuple];
}
}
function remove(name, self) {
var callbacks = events[name];
if (Array.isArray(callbacks)) {
events[name] = callbacks.filter((tuple) => {
return tuple[0] != self;
})
}
}
function emit(name, data) {
var cb = events[name],callbacks;
if(cb){
callbacks = [];
callbacks.push(cb[0]);
}
console.log(callbacks);
if (Array.isArray(callbacks)) {
callbacks.map((tuple) => {
var self = tuple[0];
var callback = tuple[1];
callback.call(self, data);
})
}
}
exports.on = on;
exports.remove = remove;
exports.emit = emit;
用法 Link to heading
-
在需要发送和监听事件的页面引入此js
-
发送事件:event.emit(‘事件名’, 发送的数据) eg: event.emit(‘chat’, ‘success’)
-
监听事件:event.on(‘事件名’,this,data => { console.log(data) }) eg: event.on(‘chat’,this,data => { console.log(data) })
-
移除事件:event.remove(‘事件名’, this) eg: event.remove(‘chat’, this) 监听事件后,必须在页面的onUnload方法里面写入移除事件