vue-消息订阅与发布

消息订阅与发布

这第三方库，可以让组件之间相互通信

安装如下：

//这是我们选择的库
npm i pubsub-js

需要订阅和发布的组件导入这个包

import pub from 'pubsub-js'

shool.vue

 // 接收消息，消息名是sendMsg
  this.pubId = pub.subscribe('sendMsg',(msgName,data) =>{
    console.log('--shool组件收到消息了--',data)
  })

第一个参数msgName，打印的是发布名sendMsg，第二个参数data才是接收发布的数据
但是一般不需要第一个参数，所以可以用_来占位第一个参数；如下：

//用this是为了指定为组件实例对象，不然this就是subscribe的实例对象
 this.pubId = pub.subscribe('sendMsg',(_,data) =>{
    console.log('--shool组件收到消息了--',data)
  })

test.vue

//发布消息，API是publish
   pub.publish('sendMsg',444)

shool.vue取消订阅

//在销毁前取消订阅，this.pubId这是指定哪个订阅
beforeDestroy(){
   pub.unsubscribe(this.pubId)
 }