vue3 emit使用

在Vue 3中，`emit`方法用于在子组中触发父组件中注册的事件。下面是使用`emit`方法的示例步骤：

1. 在父组件中，使用`v-on`或者简写的`@`语法注册一个自定义事件，例如：

<template>
  <div>
    <child-component @customEvent="handleCustomEvent"></child-component>
  </div>
</template>

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

export default {
  components: {
    ChildComponent,
  },
  methods: {
    handleCustomEvent(payload) {
      // 处理自定义事件的逻辑
      console.log(payload);
    },
  },
};
</script>

2. 在子组件中，通过`this.$emit`方法触发父组件中注册的自定义事件，例如：

<template>
  <div>
    <button @click="triggerCustomEvent">触发自定义事件</button>
  </div>
</template>

<script>
export default {
  methods: {
    triggerCustomEvent() {
      this.$emit('customEvent', payload);
    },
  },
};
</script>

在`this.$emit`方法中，第一个参数是要触发的事件名称（与父组件中注册的事件名称一致），第二个参数是可选的传递给父组件的数据。

这样，当点击子组件中的按钮时，会触发父组件中的`handleCustomEvent`方法，并传递对应的数据。你可以根据具体的需求，在父组件的处理方法中进行相应的操作。