VUE中组件和组件的通信

前面我们说过父组件和子组件的通信，子组件和父组件的通讯，那么子组件和子组件是如何通信的呢？

这个时候我们要想到使用bus这个变量来解决问题了。
先定义一个全局变量：

import Vue from 'vue'
let bus = new Vue()
export default bus

子组件向另一个组件传递数据：

abcUnread() {
        this.apiGet('/message/public/xxxx', '').then((res) => {
          this.handelResponse(res, (data) => {
            if (res.code == 200) {
              if (data.data.unread > 99) {
                this.unreads = '...'
              } else if (data.data.unread) {
                this.unreads = data.data.unread
              }
            }
            // $emit 开始向另一个组件传递数据    
            bus.$emit('unread', this.unreads)
          })
        })
      },

子组件接收传递过来的数据：

 // 获取未读数
      unread: function(val) {
        // $on 接收传递过来数据
        bus.$on('unread', (data) => {
          this.unreads = data
        })
        this.apiGet('/message/xxxx', '').then((res) => {
          this.handelResponse(res, (data) => {
            if (res.code == 200) {
              if (data.data.unread > 99) {
                this.unreads = '...'
              } else {
                this.unreads = data.data.unread
              }
            }
          })
        })
      },