typescript - 使用 Options API 为 vue 3 的 emits 定义类型
在 Vue 3 Options API 中,有没有一种方法可以像在 Composition API 中那样输入 emits?根据 Composition API 的方式(文档):
<script setup lang="ts">
// type-based
const emit = defineEmits<{
(e: 'change', id: number): void
(e: 'update', value: string): void
}>()
</script>
但对于 Options API,我们只有有效负载验证(文档):
emits: {
addBook(payload: { bookName: string }) {
// perform runtime validation
return payload.bookName.length > 0
}
}
因此,如果我们不需要验证,eslint 会将参数视为未使用:
emits: {
change: (id: number) => true // 'id' is defined but never used
}
答案#1
可以添加一个忽略注释来消除警告:
// eslint-disable-next-line no-unused-vars @typescript-eslint/no-unused-vars
change: (id: number) => true
或者对 id 实现一个简单的验证:
change: (id: number) => typeof id === 'number'
答案#2
你可以使用类型断言,TypeScript 在类型定义中不会抛出错误:
emits: {
change: (() => true) as (id: number) => void
}
我知道这是老话题,但也许对某些人仍然有用。
