vue 发送事件(通知), 监听事件(通知)

实例: 比如接受到消息聊天消息后需要分发不同对应页面

1, 在接收到消息之后(需要发送监听的地方)需要自定一个事件(通知), 然后发送，来供页面去监听时间(通知)

mounted() {
    window.websocket.onmessage = function (evt) {
        // 定义一个监听事件, 进行发送事件,
        // 注意传的参数要用{detail: xxx}模式, 不然获取参数的地方拿不到参数
        window.dispatchEvent(new CustomEvent('testaaa', { 
            detail: { text: "消息内容"}   
        }))
        console.log('发送通知事件')
    };
  },

2, 在需要使用的页面添加事件(通知)监听

mounted() {
    //添加监听
    window.addEventListener("testaaa", this.testAction)
},
beforeDestroy(){
    //移除监听
    window.removeEventListener("testaaa", this.testAction)
},
methods: {
    // 监听响应方法, 获取传过来的参数是res.detail
    testAction(res) {
      console.log('我监听到了发送的通知', res.detail)
    },
}