这个知识点是基于自定义事件的拓展,我们需要用到vue对象原型上的方法。
1.触发x组件的a事件: x.$emit("a事件",参数...)
2.给x组件绑定a事件 x.$on("a事件",监听器函数)
3.给x组件解绑a事件 x.$off("a事件",监听器函数)
思想:通过创建一个新的vm对象,专门统一注册事件,供所有组件共同操作,达到所有组件随意隔代传值的效果。
代码:将这个新创建的vm对象添加到根组件vm对象上,即所有组件内都可以访问。
Vue.prototype.$bus=new Vue({})
为什么要专门创建一个vm对象来存放呢?
因为如果像以前那样在一个组件内定义一个事件,只能在引入该组件的组件中绑定事件,但是vm对象内所有组件都可以访问。我们一般给这个vm对象命名为$bus,即我们称为中央事件总线,我们可以把中央事件总线看做是一个桥梁,也可以把它看作是一个运输工具,它可以将两个组件的信息相互传输,传输完毕以后自己是不产生任何信息数值的。
使用时,在需要传数据的组件中this.$bus.$emit("事件名",参数1,参数2.。。。);
在接收数据的组件中,this.$bus.$on("事件名",function(...arg){处理程序});
如果不再使用可以将事件解绑,绑定的事件不再会触发:this.$bus.$off("事件名",callback解绑时触发)。