實例: 比如接受到消息聊天消息后需要分發(fā)不同對應(yīng)頁面
1, 在接收到消息之后(需要發(fā)送監(jiān)聽的地方)需要自定一個事件(通知), 然后發(fā)送,來供頁面去監(jiān)聽時間(通知)
mounted() {
window.websocket.onmessage = function (evt) {
// 定義一個監(jiān)聽事件, 進行發(fā)送事件,
// 注意傳的參數(shù)要用{detail: xxx}模式, 不然獲取參數(shù)的地方拿不到參數(shù)
window.dispatchEvent(new CustomEvent('testaaa', {
detail: { text: "消息內(nèi)容"}
}))
console.log('發(fā)送通知事件')
};
},
2, 在需要使用的頁面添加事件(通知)監(jiān)聽
mounted() {
//添加監(jiān)聽
window.addEventListener("testaaa", this.testAction)
},
beforeDestroy(){
//移除監(jiān)聽
window.removeEventListener("testaaa", this.testAction)
},
methods: {
// 監(jiān)聽響應(yīng)方法, 獲取傳過來的參數(shù)是res.detail
testAction(res) {
console.log('我監(jiān)聽到了發(fā)送的通知', res.detail)
},
}