vue 中 mitt 使用,兄弟组件通信

首先,引入"mitt": "^2.1.0",

vue 中 mitt 使用,兄弟组件通信_第1张图片

第二,创建bus.js 文件

vue 中 mitt 使用,兄弟组件通信_第2张图片

第三,使用

需要在需要通信的两个组件里都引用 第二步中的bus

组件1.vue // 触发事件的组件

import emitter from '@/utils/bus';

自己的方法(){

    emitter.emit('fRefresh', { rule, isNew });

}
组件2.js // 监听事件的组件

import emitter from '@/utils/bus';


// 在created中监听
created () {
    emitter.on('fRefresh', data => {
      // 监听实时数据变化,更新数据响应结果
      // 业务代码
    });
}

你可能感兴趣的:(VUE,Piece,vue.js,javascript,前端)