发布/订阅模式

• 订阅者

• 发布者

• 信号中心

• 我们假定，存在一个"信号中心”，

• 某个任务执行完成，就向信号中心"发布"（publish）一个信号，

• 其他任务可以向信号中心"订阅"（subscribe）这个信号，从而知道什么时候自己可以开始执行。

• 这就叫做"发布/订阅模式"（publish-subscribe pattern）

  

Vue 的自定义事件

<script src="<https://cdn.bootcdn.net/ajax/libs/vue/2.6.9/vue.js>"></script>
<script>
  let vm = new Vue();
  vm.$on('dataChange', () => {
    console.log('dataChange');
  });
  vm.$on('dataChange', () => {
    console.log('dataChange1');
  });
  vm.$emit('dataChange');
</script>

兄弟组件通信过程

// eventBus.js

  // 事件中心
  let eventHub = new Vue()

// ComponentA.vue
  // 发布者
  addTodo: function () {
      // 发布消息(事件)
      eventHub.$emit('add-todo', { text: this.newTodoText })
      this.newTodoText = ''
  }

// ComponentB.vue
  // 订阅者
  created: function () {
      // 订阅消息(事件)
      eventHub.$on('add-todo', this.addTodo)
  }

模拟 Vue 自定义事件的实现