事件的作用:
事件可用于不同页面间的数据交互,例如A页面监听了名为“test”的事件,当事件发生时改变页面标题。
B页面,比如点击某个按钮触发并广播了“test”事件。此时A页面的标题将改变。
实现:
-- 在app.js 中定义事件
eventArr: [], // 事件数组 ,用于存储事件
addEventListener: function (eventName, cb) { // 注册自定义事件
var len = this.eventArr.length
if (len < 1) {
this.eventArr.push({ eventName: eventName, cbArray: [{ callback: cb }] })
} else {
for (var i = 0; i < len; i++) {
if (this.eventArr[i].eventName == eventName) {
this.eventArr[i].cbArray.push({ callback: cb })
return
}
}
this.eventArr.push({ eventName: eventName, cbArray: [{ callback: cb }] })
}
},
sendEvent: function (eventName, paramObj) { // 触发事件
var len = this.eventArr.length
for (var i = 0; i < len; i++) {
if (this.eventArr[i].eventName == eventName) {
var pa = paramObj || {}
for (var j = 0; j < this.eventArr[i].cbArray.length; j++) {
this.eventArr[i].cbArray[j].callback(pa)
}
break
}
}
},
removeEvent: function (eventName) { // 移除事件
var len = this.eventArr.length
for (var i = 0; i < len; i++) {
if (this.eventArr[i].eventName == eventName) {
this.eventArr.splice(i, 1)
break
}
}
}
-- 在其他任意页面监听事件(建议在onLoad中监听)
app.addEventListener('test',function(res){
// 收到事件后的处理逻辑,res为sendEvent的第二个参数
}.bind(this))
-- 触发事件
app.sendEvent('test',{title:'xiapu'})