在单页应用(SPA)的Vue组件化开发中，当需要处理兄弟组件之间的通信时，通常利用总线（Event Bus）即观察者设计模式来实现。举例说明，两个同级的Child组件，通过父组件传递不同值展示各自内容，点击任一组件，需同步另一组件的内容。本文展示了如何运用总线进行这种交互操作。
在SPA中，经常采用组件化开发的方式，其中父子组件可以使用@xxx和$emit的方式进行通信，但是兄弟组件(如图中第三层的任意两个组件)间的通信，则需要使用总线进行通信。即观察者设计模式。
示例如下：
开始页面上有两个child组件，通过父组件传入不同的值分别具有不同的内容，现在想要实现的功能是，点击任意一个组件，使另一个组件变成与自己相同的内容。
在代码中可以看出，这两个组件是同级的组件，所以需要引入总线实现通信。
最终效果:
Vue中Peer组件的总线通信方式
扫一扫
评论
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
查看更多评论
添加红包
