vue3 + ts中有哪些类型是由vue3提供的?

在 Vue 3 中结合 TypeScript 使用时,Vue 提供了一系列的类型帮助函数和接口,这些类型用于增强 TypeScript 的集成和提供类型安全。以下是一些由 Vue 3 提供的常用 TypeScript 类型:

  1. RefType: 用于标注一个 ref 返回的响应式引用类型。
  2. ReactiveType: 用于标注一个 reactive 返回的响应式对象。
  3. ComponentPublicInstance: 用于标注一个组件的公共实例类型,通常用于 setup 函数中的 getCurrentInstance 返回值。
  4. PropType: 用于定义 props 的类型。
  5. EmitsOptions: 用于标注自定义事件发射器的类型。
  6. SetupContext: 用于标注 setup 函数的第二个参数的类型。
  7. DefineComponent: 用于标注由 defineComponent 创建的组件类型。
  8. ComponentOptions: 用于标注组件选项的类型,例如在使用 defineComponent 时。
  9. VNode: 用于标注虚拟节点类型。
  10. WatchEffect: 用于标注 watchEffect 的回调函数类型。
  11. WatchSource: 用于标注 watch 的源类型。
  12. WatchCallback: 用于标注 watch 的回调函数类型。

此外,Vue 3 还提供了对 Composition API 的类型支持,如 ToRefs, ComputedRef, WritableComputedRef 等。

对于 TypeScript 的一些常用类型,以下是在 Vue 项目中可能会频繁使用的:

  1. Partial: 用于创建一个类型,这个类型将某个类型的所有属性设置为可选。
  2. Required: 用于创建一个类型,这个类型将某个类型的所有属性设置为必选。
  3. Readonly: 用于创建一个类型,这个类型将某个类型的所有属性设置为只读。
  4. Record: 用于创建一个具有键类型 K 和值类型 T 的对象类型。
  5. ReturnType: 用于获取一个函数返回值的类型。
  6. Pick: 用于从类型 T 中挑选一组属性 K
  7. Omit: 用于从类型 T 中剔除一组属性 K
  8. Exclude: 用于从类型 T 中排除可分配给 U 的那些类型。
  9. NonNullable: 用于排除 nullundefined 从类型 T 中。

在 Vue 3 + TypeScript 的项目中,你可以将这些 Vue 类型与 TypeScript 的工具类型结合起来,以创建更复杂和精确的类型定义。这些类型定义可以帮助你在编译时捕获潜在的错误并提供更好的编辑器支持和代码自动补全功能。

你可能感兴趣的:(vue3+ts,vue.js,前端,javascript)