手把手学习Vue3.0：Vue3.0正确使用Bus总线mitt实现组件间通信和传参

背景

在使用Vue做后台管理系统的过程中，需要实现组件间的参数传递。Bus方式非常简洁方便，却遇到一个奇怪的现象，我单击菜单区域，需要在header中展示操作导航，内容区域做展示。结果header区域没有反应。下面我分别介绍Vue3.0如何集成Bus，同时复盘一下问题的整个过程。

Vue3.0集成Bus 

• Vue到3.0之后的Bus的方式变成了使用mitt。2.0是通过创建一个空的Vue来作为总线。
• 使用emit来注册，emitt("type","event");，可以先这样理解：第一个参数可以理解成事件名称，第二个参数通常是参数。
• 使用on来监听，on("type",“handler”=>{这里是具体操作逻辑});第一个参数同上的第一个参数要对应上，才说明一个事件。
• emitt和on是成对出现，一个发起，一个接收。
• 2.0之前是$emitt，$on，3.0去掉了$，后面给出例子
• 接收方可以是多个组件，只要第一个参数匹配都可以获取到想要的数据，这样确实很方便，也是Vue的一个优势。