Explorar el Código

fix(types): support Vue interface augmentations in defineComponent

fix #12642
Evan You hace 3 años
padre
commit
005e52d0b6

+ 8 - 1
types/test/augmentation-test.ts

@@ -1,4 +1,4 @@
-import Vue from '../index'
+import Vue, { defineComponent } from '../index'
 
 declare module '../vue' {
   // add instance property and method
@@ -44,3 +44,10 @@ vm.$instanceMethod()
 
 Vue.staticProperty
 Vue.staticMethod()
+
+defineComponent({
+  mounted() {
+    this.$instanceMethod
+    this.$instanceProperty
+  }
+})

+ 1 - 0
types/test/v3/define-component-test.tsx

@@ -1143,6 +1143,7 @@ defineComponent({
 // https://github.com/vuejs/vue/issues/12628#issuecomment-1177258223
 defineComponent({
   render(h) {
+    // vue 2
     this.$listeners
     this.$on('foo', () => {})
     this.$ssrContext

+ 15 - 15
types/v3-component-public-instance.d.ts

@@ -5,7 +5,7 @@ import {
 } from './v3-generated'
 import { UnionToIntersection } from './common'
 
-import { Vue, Vue2Instance, VueConstructor } from './vue'
+import { Vue, VueConstructor } from './vue'
 import {
   ComputedOptions,
   MethodOptions,
@@ -13,8 +13,7 @@ import {
   ComponentOptionsMixin,
   ComponentOptionsBase
 } from './v3-component-options'
-import { EmitFn, EmitsOptions, Slots } from './v3-setup-context'
-import { VNode } from './vnode'
+import { EmitFn, EmitsOptions } from './v3-setup-context'
 
 /**
  * Custom properties added to component instances in any way and can be accessed through `this`
@@ -173,18 +172,19 @@ interface Vue3Instance<
   Defaults,
   MakeDefaultsOptional,
   Options
-> extends Vue2Instance {
-  $data: D
-  readonly $props: Readonly<
-    MakeDefaultsOptional extends true
-      ? Partial<Defaults> & Omit<P & PublicProps, keyof Defaults>
-      : P & PublicProps
-  >
-  readonly $root: ComponentPublicInstance | null
-  readonly $parent: ComponentPublicInstance | null
-  readonly $emit: EmitFn<E>
-  readonly $options: Options & MergedComponentOptionsOverride
-}
+> extends Vue<
+    D,
+    Readonly<
+      MakeDefaultsOptional extends true
+        ? Partial<Defaults> & Omit<P & PublicProps, keyof Defaults>
+        : P & PublicProps
+    >,
+    ComponentPublicInstance | null,
+    ComponentPublicInstance,
+    ComponentPublicInstance[],
+    Options & MergedComponentOptionsOverride,
+    EmitFn<E>
+  > {}
 
 type MergedHook<T = () => void> = T | T[]
 

+ 17 - 9
types/vue.d.ts

@@ -35,17 +35,25 @@ export interface CreateElement {
   ): VNode
 }
 
-export interface Vue extends Vue2Instance {
-  readonly $data: Record<string, any>
-  readonly $props: Record<string, any>
-  readonly $parent: Vue
-  readonly $root: Vue
-  readonly $children: Vue[]
+export interface Vue<
+  Data = Record<string, any>,
+  Props = Record<string, any>,
+  Parent = never,
+  Root = never,
+  Children = never,
+  Options = never,
+  Emit = (event: string, ...args: any[]) => Vue
+> {
+  // properties with different types in defineComponent()
+  readonly $data: Data
+  readonly $props: Props
+  readonly $parent: Parent extends never ? Vue : Parent
+  readonly $root: Root extends never ? Vue : Root
+  readonly $children: Children extends never ? Vue[] : Children
   readonly $options: ComponentOptions<Vue>
-  $emit(event: string, ...args: any[]): this
-}
+  $emit: Emit
 
-export interface Vue2Instance {
+  // Vue 2 only or shared
   readonly $el: Element
   readonly $refs: {
     [key: string]: Vue | Element | (Vue | Element)[] | undefined