vue2中使用 $bus

前言

每次使用这个技术总是忘记 每次都得百度 决定写道自己的博客里面

一、再main.js中 挂载在$bus

new Vue({ el: '#app', router, store, render: h => h(App),
	beforeCreate(){
	  Vue.prototype.$bus  = this  
	  // 往Vue的原型上放一个 全局事件总线 $bus(可以任意命名,但是约定俗成用$bus),
	  // 在子组件VueComponent中就能调用到这个原型里的东西,因为子组件原型会往Vue的原型上面找
	}
})

二、使用

1.监听事件

this.$bus.$on("functionName",(params)=>{
   console.log(params)
})

2.触发事件

代码如下(示例):


this.$bus.$emit("functionName", '参数')

3.页面卸载

this.$bus.$off(['事件1','事件2'])

完成

你可能感兴趣的:(vue,vue.js,前端,javascript)