当前位置: 代码迷 >> 综合 >> vue之事件总线(EventBus)慎用
  详细解决方案

vue之事件总线(EventBus)慎用

热度:46   发布时间:2023-12-23 15:20:33.0

通常适用于兄弟组件传值
最好规划好作用范围
- 通过实例控制范围(不同范围不同实例)
- 通过命名空间控制范围(不同范围共享同一实例)

新建event-bus.js

import Vue from 'vue'
export const EventBus = new Vue()

在局部组件引入

import {
     EventBus } from "/src/event-bus.js";

注意,在组件销毁时需要先进行关闭监听!

beforeDestroy() {
    EventBus.$off("aMsg", {
    });},

发送消息:

     EventBus.$emit("aMsg", this.average.motionSizeStatus);

监听接收消息

 mounted() {
    EventBus.$on("aMsg", (msg) => {
    // A发送来的消息this.motionSizeStatus = msg;// this.msg = msg;});},