Vue global event bus

Vue global event bus

A way to communicate between components, suitable for any component communication

Install the global event bus

new Vue({
    
    
beforeCreate(){
    
    
	Vue.prototype.$bus=this   //$bus就是当前应用的vm})

Use the event bus:
1. Receive data: A component wants to receive data, then bind a custom event to $bus in the A component, and the callback of the event is left in the A component itself

methods:{
    
    
 	demo(data){
    
    
	}
}
mounted(){
    
    
	this.$bus.$on(‘xxxx’,this.demo)
}

provide data:this.$bus.$emit(‘xxxx’,数据)

It is best to use $off in the beforeDestroy hook to unbind the events used by the current component

Guess you like

Origin blog.csdn.net/m0_48546501/article/details/130608855