我有一个 Child
组件发出一个自定义事件 change
,并在 Parent
组件上监听这个事件。
代码如下
Child.vue
<template>
<button @click="onClick">emit an event</button>
</template>
<script lang="ts">
import { defineComponent } from 'vue'
export default defineComponent({
emits: ['change'],
setup(props, {emit}) {
function onClick () {
emit('change', 'This is string type payload')
}
return { onClick }
}
})
</script>
Parent.vue
<template>
<child @change="onChange" />
</template>
<script>
import { defineComponent } from 'vue'
import Child from './Child.vue'
export default defineComponent({
components: {Child},
setup(props) {
function onChange (payload: string) {
console.log(payload)
}
return { onChange }
}
})
</script>
当我在 Child
中使用 Parent
组件时,没有对 change
事件处理程序进行类型检查。
那么如何在 Child
组件中定义自定义事件类型。