Vue 中子组件像父组件传递事件？

在Vue中，子组件可以向父组件传递事件。这可以通过在子组件内部使用 $emit 方法来触发一个自定义事件，并在父组件上监听这个事件来实现。

1. 子组件触发事件：

   在子组件中，使用 $emit 来触发一个自定义事件，并传递需要传递的数据：

   <template>
     <button @click="notifyParent">Click me</button>
   </template>
   
   <script>
   export default {
     methods: {
       notifyParent() {
         this.$emit('child-event', 'Some data to pass to the parent');
       }
     }
   }
   </script>
   

2. 父组件监听事件：

   在父组件中，通过在子组件上使用自定义事件的名称（在这个例子中是 child-event），并使用 v-on 或 @ 来监听这个事件：

   <template>
     <child-component @child-event="handleChildEvent"></child-component>
   </template>
   
   <script>
   import ChildComponent from './ChildComponent.vue';
   
   export default {
     components: {
       ChildComponent
     },
     methods: {
       handleChildEvent(data) {
         console.log('Received data from child:', data);
         // 处理从子组件传递过来的数据
       }
     }
   }
   </script>
   

当子组件中的 notifyParent 方法被触发时，child-event 事件将会在父组件中被捕获，父组件中的 handleChildEvent 方法将会执行，并接收从子组件传递过来的数据。

这种事件机制使得组件之间可以进行通信，实现了子组件向父组件的数据传递。