BUS的详细使用准则

一、创建

1、直接外部创建引入到main.js

(1)新建bus.js

import Vue from vue

const bus = new Vue()

export defult bus

(2)引用方式

1、局部引用
import Bus from '@/bus.js' // 引用路径看放的位置


2、main.js中引用
import Bus from './bus.js' // 引用路径是相对位置，具体位置进行修改
Vue.prototype.$Bus = Bus

2、main中直接创建

import Vue from 'vue' 

Vue.prototype.$Bus = new Vue()

二、使用

// 触发
mounted(){
  this.$Bus.$emit('methodBus', 'value')
}


// 监听
methods:{
  onClick(){
    this.$Bus.$on('methodsBus', (value) =>{
      console.log(value)
    })
  }
}

// 销毁
beforeDestroy(){
  this.$Bus.$off('methodsBus')
}