Skip to content

Commit 89a6b5e

Browse files
guleweigulewei
authoredAug 18, 2022
feat(types): support mixins inference for new Vue() (#12737)
close #12730
·
v2.7.16v2.7.9
1 parent b4bf4c5 commit 89a6b5e

File tree

4 files changed

+166
-34
lines changed

4 files changed

+166
-34
lines changed
 

Diff for: ‎types/options.d.ts

+24-9
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ import { VNode, VNodeData, VNodeDirective, NormalizedScopedSlot } from './vnode'
33
import { SetupContext } from './v3-setup-context'
44
import { DebuggerEvent } from './v3-generated'
55
import { DefineComponent } from './v3-define-component'
6+
import { ComponentOptionsMixin } from './v3-component-options'
67

78
type Constructor = {
89
new (...args: any[]): any
@@ -93,7 +94,9 @@ export type ThisTypedComponentOptionsWithArrayProps<
9394
Methods,
9495
Computed,
9596
PropNames extends string,
96-
SetupBindings
97+
SetupBindings,
98+
Mixin,
99+
Extends
97100
> = object &
98101
ComponentOptions<
99102
V,
@@ -102,7 +105,9 @@ export type ThisTypedComponentOptionsWithArrayProps<
102105
Computed,
103106
PropNames[],
104107
Record<PropNames, any>,
105-
SetupBindings
108+
SetupBindings,
109+
Mixin,
110+
Extends
106111
> &
107112
ThisType<
108113
CombinedVueInstance<
@@ -111,7 +116,9 @@ export type ThisTypedComponentOptionsWithArrayProps<
111116
Methods,
112117
Computed,
113118
Readonly<Record<PropNames, any>>,
114-
SetupBindings
119+
SetupBindings,
120+
Mixin,
121+
Extends
115122
>
116123
>
117124

@@ -124,7 +131,9 @@ export type ThisTypedComponentOptionsWithRecordProps<
124131
Methods,
125132
Computed,
126133
Props,
127-
SetupBindings
134+
SetupBindings,
135+
Mixin,
136+
Extends
128137
> = object &
129138
ComponentOptions<
130139
V,
@@ -133,7 +142,9 @@ export type ThisTypedComponentOptionsWithRecordProps<
133142
Computed,
134143
RecordPropsDefinition<Props>,
135144
Props,
136-
SetupBindings
145+
SetupBindings,
146+
Mixin,
147+
Extends
137148
> &
138149
ThisType<
139150
CombinedVueInstance<
@@ -142,7 +153,9 @@ export type ThisTypedComponentOptionsWithRecordProps<
142153
Methods,
143154
Computed,
144155
Readonly<Props>,
145-
SetupBindings
156+
SetupBindings,
157+
Mixin,
158+
Extends
146159
>
147160
>
148161

@@ -158,7 +171,9 @@ export interface ComponentOptions<
158171
Computed = DefaultComputed,
159172
PropsDef = PropsDefinition<DefaultProps>,
160173
Props = DefaultProps,
161-
RawBindings = {}
174+
RawBindings = {},
175+
Mixin extends ComponentOptionsMixin = ComponentOptionsMixin,
176+
Extends extends ComponentOptionsMixin = ComponentOptionsMixin
162177
> {
163178
data?: Data
164179
props?: PropsDef
@@ -217,12 +232,12 @@ export interface ComponentOptions<
217232
}
218233

219234
parent?: Vue
220-
mixins?: (ComponentOptions<Vue> | typeof Vue)[]
235+
mixins?: (Mixin | ComponentOptions<Vue> | typeof Vue)[]
221236
name?: string
222237
// for SFC auto name inference w/ ts-loader check
223238
__name?: string
224239
// TODO: support properly inferred 'extends'
225-
extends?: ComponentOptions<Vue> | typeof Vue
240+
extends?: Extends | ComponentOptions<Vue> | typeof Vue
226241
delimiters?: [string, string]
227242
comments?: boolean
228243
inheritAttrs?: boolean

Diff for: ‎types/test/vue-test.ts

+38-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import Vue, { VNode } from '../index'
1+
import Vue, { VNode, defineComponent } from '../index'
22
import { ComponentOptions } from '../options'
33

44
class Test extends Vue {
@@ -246,3 +246,40 @@ const ComponentWithStyleInVNodeData = Vue.extend({
246246
])
247247
}
248248
})
249+
250+
// infer mixin type with new Vue() #12730
251+
new Vue({
252+
mixins: [
253+
defineComponent({
254+
props: {
255+
p1: String,
256+
p2: {
257+
type: Number,
258+
default: 0
259+
}
260+
},
261+
data() {
262+
return {
263+
foo: 123
264+
}
265+
},
266+
computed: {
267+
bar() {
268+
return 123
269+
}
270+
}
271+
}),
272+
{
273+
methods: {
274+
hello(n: number) {}
275+
}
276+
}
277+
],
278+
created() {
279+
this.hello(this.foo)
280+
this.hello(this.bar)
281+
// @ts-expect-error
282+
this.hello(this.p1)
283+
this.hello(this.p2)
284+
}
285+
})

Diff for: ‎types/v3-component-public-instance.d.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -79,11 +79,11 @@ type ExtractMixin<T> = {
7979
Mixin: MixinToOptionTypes<T>
8080
}[T extends ComponentOptionsMixin ? 'Mixin' : never]
8181

82-
type IntersectionMixin<T> = IsDefaultMixinComponent<T> extends true
82+
export type IntersectionMixin<T> = IsDefaultMixinComponent<T> extends true
8383
? OptionTypesType<{}, {}, {}, {}, {}, {}>
8484
: UnionToIntersection<ExtractMixin<T>>
8585

86-
type UnwrapMixinsType<
86+
export type UnwrapMixinsType<
8787
T,
8888
Type extends OptionTypesKeys
8989
> = T extends OptionTypesType ? T[Type] : never

Diff for: ‎types/vue.d.ts

+102-22
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,15 @@ import {
1313
import { VNode, VNodeData, VNodeChildren, NormalizedScopedSlot } from './vnode'
1414
import { PluginFunction, PluginObject } from './plugin'
1515
import { DefineComponent } from './v3-define-component'
16-
import { nextTick } from './v3-generated'
16+
import { nextTick, UnwrapNestedRefs, ShallowUnwrapRef } from './v3-generated'
17+
import {
18+
UnwrapMixinsType,
19+
IntersectionMixin
20+
} from './v3-component-public-instance'
21+
import {
22+
ExtractComputedReturns,
23+
ComponentOptionsMixin
24+
} from './v3-component-options'
1725

1826
export interface CreateElement {
1927
(
@@ -100,12 +108,20 @@ export type CombinedVueInstance<
100108
Methods,
101109
Computed,
102110
Props,
103-
SetupBindings = {}
104-
> = Data &
111+
SetupBindings = {},
112+
Mixin extends ComponentOptionsMixin = ComponentOptionsMixin,
113+
Extends extends ComponentOptionsMixin = ComponentOptionsMixin,
114+
PublicMixin = IntersectionMixin<Mixin> & IntersectionMixin<Extends>
115+
> = UnwrapNestedRefs<UnwrapMixinsType<PublicMixin, 'D'>> &
116+
Data &
117+
UnwrapMixinsType<PublicMixin, 'M'> &
105118
Methods &
119+
ExtractComputedReturns<UnwrapMixinsType<PublicMixin, 'C'>> &
106120
Computed &
121+
UnwrapMixinsType<PublicMixin, 'P'> &
107122
Props &
108123
Instance &
124+
ShallowUnwrapRef<UnwrapMixinsType<PublicMixin, 'B'>> &
109125
(SetupBindings extends void ? {} : SetupBindings)
110126

111127
export type ExtendedVue<
@@ -114,9 +130,20 @@ export type ExtendedVue<
114130
Methods,
115131
Computed,
116132
Props,
117-
SetupBindings = {}
133+
SetupBindings = {},
134+
Mixin extends ComponentOptionsMixin = ComponentOptionsMixin,
135+
Extends extends ComponentOptionsMixin = ComponentOptionsMixin
118136
> = VueConstructor<
119-
CombinedVueInstance<Instance, Data, Methods, Computed, Props, SetupBindings> &
137+
CombinedVueInstance<
138+
Instance,
139+
Data,
140+
Methods,
141+
Computed,
142+
Props,
143+
SetupBindings,
144+
Mixin,
145+
Extends
146+
> &
120147
Vue
121148
>
122149

@@ -142,23 +169,29 @@ export interface VueConstructor<V extends Vue = Vue> {
142169
Methods = object,
143170
Computed = object,
144171
PropNames extends string = never,
145-
SetupBindings = {}
172+
SetupBindings = {},
173+
Mixin extends ComponentOptionsMixin = ComponentOptionsMixin,
174+
Extends extends ComponentOptionsMixin = ComponentOptionsMixin
146175
>(
147176
options?: ThisTypedComponentOptionsWithArrayProps<
148177
V,
149178
Data,
150179
Methods,
151180
Computed,
152181
PropNames,
153-
SetupBindings
182+
SetupBindings,
183+
Mixin,
184+
Extends
154185
>
155186
): CombinedVueInstance<
156187
V,
157188
Data,
158189
Methods,
159190
Computed,
160191
Record<PropNames, any>,
161-
SetupBindings
192+
SetupBindings,
193+
Mixin,
194+
Extends
162195
>
163196

164197
/**
@@ -172,23 +205,29 @@ export interface VueConstructor<V extends Vue = Vue> {
172205
Methods = object,
173206
Computed = object,
174207
Props = object,
175-
SetupBindings = {}
208+
SetupBindings = {},
209+
Mixin extends ComponentOptionsMixin = ComponentOptionsMixin,
210+
Extends extends ComponentOptionsMixin = ComponentOptionsMixin
176211
>(
177212
options?: ThisTypedComponentOptionsWithRecordProps<
178213
V,
179214
Data,
180215
Methods,
181216
Computed,
182217
Props,
183-
SetupBindings
218+
SetupBindings,
219+
Mixin,
220+
Extends
184221
>
185222
): CombinedVueInstance<
186223
V,
187224
Data,
188225
Methods,
189226
Computed,
190227
Record<keyof Props, any>,
191-
SetupBindings
228+
SetupBindings,
229+
Mixin,
230+
Extends
192231
>
193232

194233
/**
@@ -211,38 +250,63 @@ export interface VueConstructor<V extends Vue = Vue> {
211250
Methods,
212251
Computed,
213252
PropNames extends string = never,
214-
SetupBindings = {}
253+
SetupBindings = {},
254+
Mixin extends ComponentOptionsMixin = ComponentOptionsMixin,
255+
Extends extends ComponentOptionsMixin = ComponentOptionsMixin
215256
>(
216257
options?: ThisTypedComponentOptionsWithArrayProps<
217258
V,
218259
Data,
219260
Methods,
220261
Computed,
221262
PropNames,
222-
SetupBindings
263+
SetupBindings,
264+
Mixin,
265+
Extends
223266
>
224267
): ExtendedVue<
225268
V,
226269
Data,
227270
Methods,
228271
Computed,
229272
Record<PropNames, any>,
230-
SetupBindings
273+
SetupBindings,
274+
Mixin,
275+
Extends
231276
>
232277

233278
/**
234279
* extend with object props
235280
*/
236-
extend<Data, Methods, Computed, Props, SetupBindings = {}>(
281+
extend<
282+
Data,
283+
Methods,
284+
Computed,
285+
Props,
286+
SetupBindings = {},
287+
Mixin extends ComponentOptionsMixin = ComponentOptionsMixin,
288+
Extends extends ComponentOptionsMixin = ComponentOptionsMixin
289+
>(
237290
options?: ThisTypedComponentOptionsWithRecordProps<
238291
V,
239292
Data,
240293
Methods,
241294
Computed,
242295
Props,
243-
SetupBindings
296+
SetupBindings,
297+
Mixin,
298+
Extends
244299
>
245-
): ExtendedVue<V, Data, Methods, Computed, Props, SetupBindings>
300+
): ExtendedVue<
301+
V,
302+
Data,
303+
Methods,
304+
Computed,
305+
Props,
306+
SetupBindings,
307+
Mixin,
308+
Extends
309+
>
246310

247311
/**
248312
* extend with functional + array props
@@ -287,7 +351,9 @@ export interface VueConstructor<V extends Vue = Vue> {
287351
Methods,
288352
Computed,
289353
PropNames extends string = never,
290-
SetupBindings = {}
354+
SetupBindings = {},
355+
Mixin extends ComponentOptionsMixin = ComponentOptionsMixin,
356+
Extends extends ComponentOptionsMixin = ComponentOptionsMixin
291357
>(
292358
id: string,
293359
definition?: ThisTypedComponentOptionsWithArrayProps<
@@ -296,25 +362,39 @@ export interface VueConstructor<V extends Vue = Vue> {
296362
Methods,
297363
Computed,
298364
PropNames,
299-
SetupBindings
365+
SetupBindings,
366+
Mixin,
367+
Extends
300368
>
301369
): ExtendedVue<
302370
V,
303371
Data,
304372
Methods,
305373
Computed,
306374
Record<PropNames, any>,
307-
SetupBindings
375+
SetupBindings,
376+
Mixin,
377+
Extends
308378
>
309-
component<Data, Methods, Computed, Props, SetupBindings>(
379+
component<
380+
Data,
381+
Methods,
382+
Computed,
383+
Props,
384+
SetupBindings,
385+
Mixin extends ComponentOptionsMixin = ComponentOptionsMixin,
386+
Extends extends ComponentOptionsMixin = ComponentOptionsMixin
387+
>(
310388
id: string,
311389
definition?: ThisTypedComponentOptionsWithRecordProps<
312390
V,
313391
Data,
314392
Methods,
315393
Computed,
316394
Props,
317-
SetupBindings
395+
SetupBindings,
396+
Mixin,
397+
Extends
318398
>
319399
): ExtendedVue<V, Data, Methods, Computed, Props, SetupBindings>
320400
component<PropNames extends string>(

0 commit comments

Comments
 (0)
Please sign in to comment.