vue3 broadcast

在 Vue 3 中，`$broadcast` 是一种用于从一个组件向其祖先组件树广播事件的方法。通常情况下，当你想要在整个组件链路中通知上一层级的组件时，可以使用这个功能，比如通知某个状态变化会影响到所有父级组件。

下面是一个简单的例子：

<template>
  <button @click="sendBroadcast">发送广播</button>
  <!-- 子组件 -->
</template>

<script setup>
import { ref, onMounted } from 'vue';

const sendData = ref(null);

onMounted(() => {
  // 当子组件触发 sendBroadcast 函数时，它会在祖先组件中触发 parentEvent
  function sendBroadcast() {
    sendData.value = 'Hello';
    // 使用 $broadcast 触发 event，并将数据作为参数传递
    this.$broadcast('parentEvent', sendData.value);
  }
});
</script>

在这个示例中，点击按钮时，`sendBroadcast` 会被调用，然后向上广播名为 "parentEvent" 的事件，并附带数据。每个父组件（如果有监听此事件）都可以接收到这个消息。