Vue笔记（十四）—— Vue eventBus自定义组件间值传递

1.新建eventBus.js：

import Vue from 'vue';
export default new Vue();

2.自定义组件引入：

// 引入自定义组件间传递依赖js
  import eventBus from '../../static/eventBus.js';

3.声明/传值方：

data() {
      return {
        isCollapse: false,
      }
    },
created() {
      eventBus.$emit('initCollapse', this.isCollapse);
    },

4.调用/操作方：

data() {
      return {
        headIsCollapse: true,
      };
    },
created() {
      eventBus.$on('initCollapse', (data) => {
        // 组件传过来的值
        this.headIsCollapse = data;
      })
    },

问题排查

报错a.$on is not a function：

1.eventBus引入是否正确；

2.eventBus.js代码是否正确；

参考

Vue组件通信中eventBus的使用
vue组件通过eventBus通信时，报错a.$on is not a function