Vue篇：如何详细解析EventBus在事件总线中的应用示例？

本文共计2924个文字，预计阅读时间需要12分钟。

目录+正文字符组件通信原则+EventBus简介+如何使用EventBus+初始化+发送事件+接收事件+移除事件监听器+全局EventBus+创建全局EventBus+总结+正文+现代JavaScript框架和库的核心概念是足够的。

目录

• 正文
• 父子组件通讯原则
• EventBus的简介
• 如何使用EventBus
• 初始化
• 发送事件
• 接收事件
• 移除事件监听者
• 全局EventBus
• 创建全局EventBus
• 总结

正文

许多现代JavaScript框架和库的核心概念是能够将数据和UI封装在模块化、可重用的组件中。这对于开发人员可以在开发整个应用程序时避免使用编写大量重复的代码。

虽然这样做非常有用，但也涉及到组件之间的数据通讯。在Vue中同样有这样的概念存在。通过前面一段时间的学习，Vue组件数据通讯常常会有父子组件，兄弟组件之间的数据通讯。也就是说在Vue中组件通讯有一定的原则。

父子组件通讯原则

为了提高组件的独立性与重用性，父组件会通过props向下传数据给子组件，当子组件有事情要告诉父组件时会通过$emit事件告诉父组件。