vue订阅消息和发布消息

        上一个文章我们说到两个组件之间可以利用全局中间组件来实现，其实还有一个更简单的方法可以实现两个组件之间的通信，那就是订阅消息和发布消息。

        顾名思义也知道，需要数据的那个组件来订阅消息就可以了，然后等着那个有数据的组件来发布消息就可以了。理解起来也是很容易的。先画个图演示一波:

 这个图也很清晰的描述了这样一个过程，当然，代码也是很好实现的，也都是键名之意：

        首先得需要一个第三方库，叫pubsub-js

npm i pubsub-js

安装完成之后我们就可以直接使用了

 需要订阅消息的先订阅消息:

import pusub from 'pubsub-js';
export default {
  mounted(){//挂载完成
    //先订阅一个消息
    this.pubid = pusub.subscribe("haha",(xiaoximing,data)=>{
      console.log('消息回调',data);
    })
  },
  beforeDestroy(){
    pusub.unsubscribe(this.pubid)
  }
}

然后等着发送数据的组件来发布:

import pusub from 'pubsub-js';
export default {
  methods:{
    sub(){
      pusub.publish("haha",1);
    }
  }
}

然后来总结一下:

        订阅消息是 pusub.subscribe("订阅消息名称","(回调函数,第一个参数是消息名称，戴第二个参数是传回的数据)=>")

        发布消息是pubsub.publish("订阅消息名称"，“要发布的信息数据”);