What is Vue Global Event Bus?

 The global event bus is not a native API provided by Vue. It is a clever design method summarized by developers in practice. Its principle is to add a property to the prototype of Vue. Once this property is added, Vue Instances and vue components can use this property with the help of prototypes, so as to realize the intercommunication and transfer of data between data. If we need to implement complex communication between components, it is not so convenient to use the props properties of parent and child components. We have written a lot of redundant code layer by layer. At this time, we can use the message bus writing method, which is more simple and convenient. 

Usage steps: register global event bus

new Vue({

  render: h => h(App),

  beforeCreate(){

    Vue.prototype.$bus=this

  }

}).$mount('#app');

User bound event

 methods: {

      needDate(name){

        console.log(name)

        alert("I need data")

      }

    },

    mounted() {

      this.$bus.$on("bindEventName",this.needDate)

    },

    beforeDestroy() {

      this.$bus.$off("bindEventName")

    },

sender trigger event

 methods: {

    send(){

      this.$bus.$emit("bindEventName",this.name)

    }