消息订阅与发布

  1. 一种组件间通信的方式,适用于任意组件间通信

使用方法

1. 安装pubsub

npm i pubsub-js@1.6

2. 引入

import pubsub from 'pubsub-js'

3. 接收数据

A组件想接收数据,则在A组件中订阅消息,订阅的回调在A自身。
写法1:如果在订阅消息里定义回调,需要使用箭头函数

mounted() {
    //订阅消息
    this.pid = pubsub.subscribe('事件名', (msgName, data) => {
	    ...
	})
}

写法2:也可以在方法里定义回调

methods: {
    demo(msgName, data){...}
},
mounted() {
    this.pid = pubsub.subscribe('事件名', this.demo)
}

4. 提供数据

在提供数据的组件里定义一个方法:

methods: {
    方法名() {
	    pubsub.publish('事件名', data)
	}
}

5. 取消订阅

最好在订阅消息的组件中,在组件即将销毁时取消订阅。

beforeDestroy() {
    pubsub.unsubscribe(this.pid)
}