vue-bus 
A event bus for Vue.js, support both Vue 1.0 and 2.0. See Vue documentation for more detail.
Installation
You can install it via yarn or npm.
$ yarn add vue-bus
$ npm install vue-bus --save
And it's available on jsdelivr or unpkg.
<!-- development version -->
<script src="https://cdn.jsdelivr.net/npm/vue-bus/dist/vue-bus.js"></script>
<!-- production version -->
<script src="https://cdn.jsdelivr.net/npm/vue-bus/dist/vue-bus.min.js"></script>When used with a module system, you must explicitly install the bus via Vue.use():
import Vue from 'vue';
import VueBus from 'vue-bus';
Vue.use(VueBus);You don't need to do this when using global script tags.
Usage
Listen and clean
// ...
created() {
this.$bus.on('add-todo', this.addTodo);
this.$bus.once('once', () => console.log('This listener will only fire once'));
},
beforeDestroy() {
this.$bus.off('add-todo', this.addTodo);
},
methods: {
addTodo(newTodo) {
this.todos.push(newTodo);
}
}Trigger
// ...
methods: {
addTodo() {
this.$bus.emit('add-todo', { text: this.newTodoText });
this.$bus.emit('once');
this.newTodoText = '';
}
}Another way to use vue-bus
// xxx.js
import Vue from 'vue';
Vue.bus.emit('someEvent');Note: on once off emit are aliases for $on $once $off $emit. See the API for more detail.