在util文件夹下面新建js文件EventBus.js
import Vue from "vue";
/**
* 事件总线
* @usage:
* EventBus.$emit('event',payload);
* EventBus.$on('on',(payload)=>{});
*/
const EventBus = new Vue();
export default EventBus;
A组件中使用
import EventBus from '@/util/EventBus'
EventBus.$emit('refreshNotice')
B组件中使用
import EventBus from '@/util/EventBus'
mounted() {
// $on事件不会自动自动清除,导致事件出现累计,触发多次
// 每次使用之前清除
EventBus.$off('refreshNotice')
EventBus.$on('refreshNotice', () => {
this.getNoticeList()
})
},
//销毁监听
beforeDestroy() {
EventBus.$off('refreshNotice')
},
网友评论