跨组件通知vue插件

English | 简体中文

A lightweight vue cross-component communication plugin，designed with Subscribe/Publish mode。when Publisher post notifications with specific topic，subscribers will receive the notification if they subscribe this topic。

Note that, Notification Center is a global singleton

using npm

$ npm i vue-notification-center -S Install

in main.js:

import Vue from 'vue' import nc from 'vue-notification-center' Vue.use(nc) How to use Publisher:

// componentA.vue methods: { someMethod () { let data = {msg: 'data to be transmitted'} this.$nc.publish('someTopic', data) } }

fine, you just published a notification with topic someTopic,subscribers will receive the notification if they subscribe topic named 'someTopic'。

the Notification Center will not broadcast the notification if this topic has no subscribers, it will silently fail.

// componentB.vue methods: { onReceived (message) { let {notifyFrom, notifyTo, data} = message console.log(notifyFrom, notifyTo, data) } }, created () { this.$nc.subscribe('someTopic', this.onReceived) }

componentB subscribed to the notification with topic someTopic.if someone published this notification, and then Notification Center will invoke the given callback

Before the subscriber component instance is destroyed, it will automatically unsubscribes all subscribed topics without having to manually cancel. Subsequent versions will be added with a manual unsubscribe method.

the api has been mixin to all vue instance,you can call them like this.$XXXX