事件总线(eventbus)实际上是一个vue组件,因为是vue创建的组件,所有其他所有组件都能访问和修改其上的内容,才能够满足所有组件进行传参的需求
vue文档中并没有介绍有关事件总线的使用,是程序员们摸索出来的一种能进行组件传参的工具
它不仅可以传参,还可以一定程度上代替vuex进行简单的数据共享,甚至在小型项目中数据共享方面代替了vuex。
应用:
在main.js中引入并命名
在A组件中先引入getCurrentInstance方法,再将$bus方法声明
利用bus的emit方法绑定,第一个参数为函数名,第二个参数为需要传的参数。
触发showDetail即可绑定成功,任何组件都可用$bus.on方法调用
(注:此处为ts写法,需要给参数定义类型,js无需定义,)
在B组件中同上两步骤
可在生命周期函数onMounted中调用,如此B组件就能使用A组件传过来的参数。
组件失效后用off方法删除,避免on方法出现bug多次调用
代替vuex的数据共享,即在A组件中用emit绑定函数与传参,B,C,D,E组件都可以用on方法获取参数,达到了数据状态共享的目的