defineEmit

稳定性: 实验性 ⚠️ 实验性功能，风险自负

使用 defineEmit 逐个声明单个 emit。

特性	支持
Vue 3	✅
Nuxt 3	✅
Vue 2	✅
TypeScript	✅
Volar Plugin	✅

WARNING

defineEmit 不能与 defineEmits 同时使用。

API 参考

defineEmit<T>(emitName)
defineEmit<T>(emitName, validator)

// emitName 参数是可选的，
// 并且可从变量名中推断出
const emitName = defineEmit<T>()

基本用法

<script setup>
// 声明 emit
const increment = defineEmit('increment')
// 从变量名中推断出 emit 名称
const change = defineEmit()
// emit 事件
increment()
</script>

带验证的用法

<script setup>
// 声明带验证的事件
const increment = defineEmit('increment', (value) => value < 20)
</script>

TypeScript

<script setup lang="ts">
const increment = defineEmit('increment', (value: number) => value < 20)
const decrement = defineEmit<[value: number]>()

increment(2) // pass
increment('2') // TS type error
</script>

Volar 配置

// tsconfig.json
{
  "vueCompilerOptions": {
    "target": 3, // 或 2.7 用于 Vue 2
    "plugins": [
      "@vue-macros/volar/define-emit",
      // ...更多功能
    ],
  },
}