$emit()在<script setup>中的用法

在 <script setup> 中使用 `$emit()` 非常简单，我们只需要使用 `defineEmits()` 函数来定义组件的自定义事件，然后在方法中调用 `$emit()` 来触发事件即可。下面是一个例子：

<template>
  <button @click="increment">{{ count }}</button>
</template>

<script setup>
import { ref, defineEmits } from 'vue'

const count = ref(0)

// 定义自定义事件
const emits = defineEmits(['increment'])

function increment() {
  count.value++
  // 触发自定义事件
  emits('increment', count.value)
}
</script>

在这个例子中，我们定义了一个名为 increment 的方法，并在该方法中调用了 `$emit()` 方法来触发了一个名为 "increment" 的自定义事件。我们在 `defineEmits()` 函数中定义了该组件支持的自定义事件列表，这样就可以在方法中调用 `$emit()` 方法来触发自定义事件了。当自定义事件被触发时，我们可以传递任意数量的参数给 `$emit()` 方法，这些参数会被传递给自定义事件的监听器。在这个例子中，我们传递了当前的计数器值 `count.value` 给 `increment` 事件的监听器。