为 emits 标注类型
<script setup lang="ts"> // 运行时 const emit = defineEmits(['change', 'update']) // 基于类型 const emit = defineEmits<{ (e: 'change', id: number): void (e: 'update', value: string): void }>() </script>
import { defineComponent } from 'vue' export default defineComponent({ emits: ['change'], setup(props, { emit }) { emit('change') // <-- 类型检查 / 自动补全 } })
为 ref() 标注类型
默认推导类型
ref 会根据初始化时的值自动推导其类型：
import { ref } from 'vue' // 推导出的类型：Ref<number> const year = ref(2020) // => TS Error: Type 'string' is not assignable to type 'number'. year.value = '2020'
通过接口指定类型
有时我们可能想为 ref 内的值指定一个更复杂的类型，可以通过使用 Ref 这个接口：
import { ref } from 'vue' import type { Ref } from 'vue' const year: Ref<string | number> = ref('2020') year.value = 2020 // 成功！
通过泛型指定类型
或者，在调用 ref() 时传入一个泛型参数，来覆盖默认的推导行为：
// 得到的类型：Ref<string | number> const year = ref<string | number>('2020') year.value = 2020 // 成功！
如果你指定了一个泛型参数但没有给出初始值，那么最后得到的就将是一个包含 undefined 的联合类型：
// 推导得到的类型：Ref<number | undefined> const n = ref<number>()
