$emit $on兄弟级怎么使用

`$emit` 和 `$on` 是 Vue.js 中用于组件通信的重要方法，它们在父子组件或者同级组件间用来传递数据和触发事件。下面是它们的基本用法：

1. **$emit**: 这个方法在子组件中使用，用于触发一个自定义事件，并且可以传递数据。例如，当你想从子组件向父组件发送一个通知时，你会这样做：

   <!-- 子组件 -->
   <template>
     <button @click="$emit('parentEvent', 'data sent from child')">
       Trigger Parent Event
     </button>
   </template>

   <script>
   export default {
     methods: {
       sendDataToParent() {
         this.$emit('parentEvent', 'data here');
       }
     }
   }
   </script>

2. **$on**: 这个方法在父组件（或者其他监听者）中使用，用于接收并处理来自其他组件的事件：

   <!-- 父组件 -->
   <template>
     <child-component @parentEvent="handleParentEvent"></child-component>
   </template>

   <script>
   import ChildComponent from './ChildComponent.vue';

   export default {
     components: { ChildComponent },
     methods: {
       handleParentEvent(data) {
         console.log('Received data:', data);
       }
     }
   }
   </script>

- **相关问题--:**
1. 何时应该在子组件中使用$emit？
2. 如何在Vue中订阅事件并处理数据？
3. 父组件如何通过$on响应子组件的事件？