vue3中，将父组件传递的所有事件绑定到子组件的根元素上

在 Vue 3 中，如果你想要将父组件传递给子组件的所有自定义事件绑定到子组件的根元素上，通常是在父组件中通过 `v-on` 或者 `@` 指令来触发这些事件，并将它们作为 prop 传递给子组件。子组件接收到这些事件后，可以在其模板中使用 `v-on="$listeners"` 来接收并处理这些外部事件。

例如：

<!-- 父组件 -->
<template>
  <div>
    <button @click="parentEvent">点击触发子组件事件</button>
    <child-component :event-listeners="parentEventHandler"></child-component>
  </div>
</template>

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

export default {
  components: {
    ChildComponent
  },
  methods: {
    parentEvent() {
      this.$emit('parentEvent', '这是来自父组件的事件');
    },
    parentEventHandler(event) {
      console.log('子组件接收到的事件:', event);
    }
  }
};
</script>

然后，在子组件的 template 部分，你可以这样应用事件监听器：

<!-- 子组件 ChildComponent.vue -->
<template>
  <div v-on="$listeners">
    <!-- 这里绑定了所有的事件，子组件会转发它接收到的所有事件 -->
  </div>
</template>

这样，当你在父组件中触发 `parentEvent` 时，子组件就会收到这个事件，然后按照你的逻辑进行响应。