父组件使用哪种方法监听子组件的事件

在Vue.js中，父组件可以使用`v-on`指令或`@`符号来监听子组件触发的事件。

假设子组件中定义了一个名为`my-event`的自定义事件，可以通过以下两种方式在父组件中监听该事件：

1. 使用`v-on`指令

<template>
  <my-component v-on:my-event="handleMyEvent"></my-component>
</template>

在上面的代码中，我们使用`v-on`指令来监听子组件触发的`my-event`事件，并将事件处理函数`handleMyEvent`作为回调函数传递给它。当子组件触发`my-event`事件时，父组件就会执行`handleMyEvent`函数。

2. 使用`@`符号

<template>
  <my-component @my-event="handleMyEvent"></my-component>
</template>

在上面的代码中，我们使用`@`符号来监听子组件触发的`my-event`事件，并将事件处理函数`handleMyEvent`作为回调函数传递给它。当子组件触发`my-event`事件时，父组件就会执行`handleMyEvent`函数。

需要注意的是，当子组件触发自定义事件时，可以通过`$emit`方法来传递数据。在父组件中，可以通过`$event`来获取子组件传递的数据，例如：

<template>
  <my-component v-on:my-event="handleMyEvent"></my-component>
</template>

<script>
export default {
  methods: {
    handleMyEvent(data) {
      console.log(data) // 这里的data就是子组件传递的数据
    }
  }
}
</script>

在上面的代码中，我们在父组件的`handleMyEvent`方法中添加了一个参数`data`，它可以获取子组件通过`$emit`方法传递的数据。在子组件中，可以通过`$emit('my-event', data)`来触发`my-event`事件并传递数据。