在vue3中建議申明`emits`選項來定義組件要觸發的自定義事件
~~~
<template>
<div>
<p>{{ text }}</p>
<button @click="$emit('accepted')">OK</button>
</div>
</template>
<script>
export default {
props: ['text'],
emits: ['accepted'] //定義要觸發的自定義事件
}
</script>
~~~
支持數組和對象的形式定義，對象的形式定義可以驗證自定義事件
```
const app = createApp({})
// 數組語法
app.component('todo-item', {
emits: ['check'],
created() {
this.$emit('check')
}
})
// 對象語法
app.component('reply-form', {
emits: {
// 沒有驗證函數
click: null,
// 帶有驗證函數
submit: payload => {
//驗證觸發的自定義事件參數是否包含email和password字段
if (payload.email && payload.password) {
return true
} else {
console.warn(`Invalid submit event payload!`)
return false
}
}
}
})
```
