Skip to content

Commit ba3b8b9

Browse files
rudyxu1102rudyxu1102
committed
chore: improve code
1 parent c3321f0 commit ba3b8b9

File tree

6 files changed

+80
-46
lines changed

6 files changed

+80
-46
lines changed

Diff for: ‎packages/dts-test/defineComponent.test-d.tsx

+43-22
Original file line numberDiff line numberDiff line change
@@ -1044,7 +1044,7 @@ describe('inject', () => {
10441044
expectType<unknown>(this.foo)
10451045
expectType<unknown>(this.bar)
10461046
// @ts-expect-error
1047-
expectError((this.foobar = 1))
1047+
this.foobar = 1
10481048
}
10491049
})
10501050

@@ -1056,7 +1056,7 @@ describe('inject', () => {
10561056
expectType<unknown>(this.foo)
10571057
expectType<unknown>(this.bar)
10581058
// @ts-expect-error
1059-
expectError((this.foobar = 1))
1059+
this.foobar = 1
10601060
}
10611061
})
10621062

@@ -1076,7 +1076,7 @@ describe('inject', () => {
10761076
expectType<unknown>(this.foo)
10771077
expectType<unknown>(this.bar)
10781078
// @ts-expect-error
1079-
expectError((this.foobar = 1))
1079+
this.foobar = 1
10801080
}
10811081
})
10821082

@@ -1085,9 +1085,9 @@ describe('inject', () => {
10851085
props: ['a', 'b'],
10861086
created() {
10871087
// @ts-expect-error
1088-
expectError((this.foo = 1))
1088+
this.foo = 1
10891089
// @ts-expect-error
1090-
expectError((this.bar = 1))
1090+
this.bar = 1
10911091
}
10921092
})
10931093
})
@@ -1193,16 +1193,14 @@ describe('define attrs', () => {
11931193
test('define attrs w/ object props', () => {
11941194
type CompAttrs = {
11951195
bar: number
1196-
baz?: string
11971196
}
11981197
const MyComp = defineComponent({
11991198
props: {
12001199
foo: String
12011200
},
12021201
attrs: Object as AttrsType<CompAttrs>,
12031202
created() {
1204-
expectType<CompAttrs['bar']>(this.$attrs.bar)
1205-
expectType<CompAttrs['baz']>(this.$attrs.baz)
1203+
expectType<number | undefined>(this.$attrs.bar)
12061204
}
12071205
})
12081206
expectType<JSX.Element>(<MyComp foo="1" bar={1} />)
@@ -1211,14 +1209,12 @@ describe('define attrs', () => {
12111209
test('define attrs w/ array props', () => {
12121210
type CompAttrs = {
12131211
bar: number
1214-
baz?: string
12151212
}
12161213
const MyComp = defineComponent({
12171214
props: ['foo'],
12181215
attrs: Object as AttrsType<CompAttrs>,
12191216
created() {
1220-
expectType<CompAttrs['bar']>(this.$attrs.bar)
1221-
expectType<CompAttrs['baz']>(this.$attrs.baz)
1217+
expectType<number | undefined>(this.$attrs.bar)
12221218
}
12231219
})
12241220
expectType<JSX.Element>(<MyComp foo="1" bar={1} />)
@@ -1227,13 +1223,11 @@ describe('define attrs', () => {
12271223
test('define attrs w/ no props', () => {
12281224
type CompAttrs = {
12291225
bar: number
1230-
baz?: string
12311226
}
12321227
const MyComp = defineComponent({
12331228
attrs: Object as AttrsType<CompAttrs>,
12341229
created() {
1235-
expectType<CompAttrs['bar']>(this.$attrs.bar)
1236-
expectType<CompAttrs['baz']>(this.$attrs.baz)
1230+
expectType<number | undefined>(this.$attrs.bar)
12371231
}
12381232
})
12391233
expectType<JSX.Element>(<MyComp bar={1} />)
@@ -1242,7 +1236,6 @@ describe('define attrs', () => {
12421236
test('define attrs w/ composition api', () => {
12431237
type CompAttrs = {
12441238
bar: number
1245-
baz?: string
12461239
}
12471240
const MyComp = defineComponent({
12481241
props: {
@@ -1254,8 +1247,7 @@ describe('define attrs', () => {
12541247
attrs: Object as AttrsType<CompAttrs>,
12551248
setup(props, { attrs }) {
12561249
expectType<string>(props.foo)
1257-
expectType<number>(attrs.bar)
1258-
expectType<string | undefined>(attrs.baz)
1250+
expectType<number | undefined>(attrs.bar)
12591251
}
12601252
})
12611253
expectType<JSX.Element>(<MyComp foo="1" bar={1} />)
@@ -1264,13 +1256,10 @@ describe('define attrs', () => {
12641256
test('define attrs w/ functional component', () => {
12651257
type CompAttrs = {
12661258
bar: number
1267-
baz?: string
12681259
}
12691260
const MyComp = defineComponent(
12701261
(props: { foo: string }, ctx) => {
1271-
expectType<number>(ctx.attrs.bar)
1272-
expectType<CompAttrs['bar']>(ctx.attrs.bar)
1273-
expectType<CompAttrs['baz']>(ctx.attrs.baz)
1262+
expectType<number | undefined>(ctx.attrs.bar)
12741263
return () => (
12751264
// return a render function (both JSX and h() works)
12761265
<div>{props.foo}</div>
@@ -1294,12 +1283,44 @@ describe('define attrs', () => {
12941283
attrs: Object as AttrsType<CompAttrs>,
12951284
created() {
12961285
// @ts-expect-error
1297-
console.log(this.$attrs.foo)
1286+
this.$attrs.foo
12981287
}
12991288
})
13001289
expectType<JSX.Element>(<MyComp foo="1" />)
13011290
})
13021291

1292+
test('attrs is always optional w/ object props', () => {
1293+
type CompAttrs = {
1294+
bar: number
1295+
}
1296+
const MyComp = defineComponent({
1297+
attrs: Object as AttrsType<CompAttrs>,
1298+
created() {
1299+
expectType<number | undefined>(this.$attrs.bar)
1300+
}
1301+
})
1302+
expectType<JSX.Element>(<MyComp />)
1303+
})
1304+
1305+
test('attrs is always optional w/ functional component', () => {
1306+
type CompAttrs = {
1307+
bar: number
1308+
}
1309+
const MyComp = defineComponent(
1310+
(props: { foo: string }, ctx) => {
1311+
expectType<number | undefined>(ctx.attrs.bar)
1312+
return () => (
1313+
// return a render function (both JSX and h() works)
1314+
<div>{props.foo}</div>
1315+
)
1316+
},
1317+
{
1318+
attrs: Object as AttrsType<CompAttrs>
1319+
}
1320+
)
1321+
expectType<JSX.Element>(<MyComp foo={'1'} />)
1322+
})
1323+
13031324
test('define attrs w/ no attrs', () => {
13041325
const MyComp = defineComponent({
13051326
props: {

Diff for: ‎packages/dts-test/defineCustomElement.test-d.ts

+23-11
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ describe('inject', () => {
1515
expectType<unknown>(this.foo)
1616
expectType<unknown>(this.bar)
1717
// @ts-expect-error
18-
expectError((this.foobar = 1))
18+
this.foobar = 1
1919
}
2020
})
2121

@@ -27,7 +27,7 @@ describe('inject', () => {
2727
expectType<unknown>(this.foo)
2828
expectType<unknown>(this.bar)
2929
// @ts-expect-error
30-
expectError((this.foobar = 1))
30+
this.foobar = 1
3131
}
3232
})
3333

@@ -47,7 +47,7 @@ describe('inject', () => {
4747
expectType<unknown>(this.foo)
4848
expectType<unknown>(this.bar)
4949
// @ts-expect-error
50-
expectError((this.foobar = 1))
50+
this.foobar = 1
5151
}
5252
})
5353

@@ -56,9 +56,9 @@ describe('inject', () => {
5656
props: ['a', 'b'],
5757
created() {
5858
// @ts-expect-error
59-
expectError((this.foo = 1))
59+
this.foo = 1
6060
// @ts-expect-error
61-
expectError((this.bar = 1))
61+
this.bar = 1
6262
}
6363
})
6464
})
@@ -75,7 +75,7 @@ describe('define attrs', () => {
7575
},
7676
attrs: Object as AttrsType<CompAttrs>,
7777
created() {
78-
expectType<number>(this.$attrs.bar)
78+
expectType<number | undefined>(this.$attrs.bar)
7979
expectType<string | undefined>(this.$attrs.baz)
8080
}
8181
})
@@ -90,7 +90,7 @@ describe('define attrs', () => {
9090
props: ['foo'],
9191
attrs: Object as AttrsType<CompAttrs>,
9292
created() {
93-
expectType<number>(this.$attrs.bar)
93+
expectType<number | undefined>(this.$attrs.bar)
9494
expectType<string | undefined>(this.$attrs.baz)
9595
}
9696
})
@@ -104,7 +104,7 @@ describe('define attrs', () => {
104104
defineCustomElement({
105105
attrs: Object as AttrsType<CompAttrs>,
106106
created() {
107-
expectType<number>(this.$attrs.bar)
107+
expectType<number | undefined>(this.$attrs.bar)
108108
expectType<string | undefined>(this.$attrs.baz)
109109
}
110110
})
@@ -117,8 +117,8 @@ describe('define attrs', () => {
117117
}
118118
defineCustomElement(
119119
(_props: { foo: string }, ctx) => {
120-
expectType<number>(ctx.attrs.bar)
121-
expectType<number>(ctx.attrs.bar)
120+
expectType<number | undefined>(ctx.attrs.bar)
121+
expectType<number | undefined>(ctx.attrs.bar)
122122
expectType<string | undefined>(ctx.attrs.baz)
123123
},
124124
{
@@ -138,7 +138,19 @@ describe('define attrs', () => {
138138
attrs: Object as AttrsType<CompAttrs>,
139139
created() {
140140
// @ts-expect-error
141-
console.log(this.$attrs.foo)
141+
this.$attrs.foo
142+
}
143+
})
144+
})
145+
146+
test('define attrs w/ no attrs', () => {
147+
defineCustomElement({
148+
props: {
149+
foo: String
150+
},
151+
created() {
152+
expectType<unknown>(this.$attrs.bar)
153+
expectType<unknown>(this.$attrs.baz)
142154
}
143155
})
144156
})

Diff for: ‎packages/runtime-core/src/apiDefineComponent.ts

+5-5
Original file line numberDiff line numberDiff line change
@@ -122,9 +122,9 @@ export function defineComponent<
122122
props?: (keyof Props)[]
123123
emits?: E | EE[]
124124
slots?: S
125-
attrs?: Attrs
125+
attrs?: Partial<Attrs>
126126
}
127-
): (props: Props & EmitsToProps<E> & PropsAttrs) => any
127+
): (props: Props & EmitsToProps<E> & Partial<PropsAttrs>) => any
128128
export function defineComponent<
129129
Props extends Record<string, any>,
130130
E extends EmitsOptions = {},
@@ -160,7 +160,7 @@ export function defineComponent<
160160
I extends ComponentInjectOptions = {},
161161
II extends string = string
162162
>(
163-
comp: ComponentOptionsWithoutProps<
163+
options: ComponentOptionsWithoutProps<
164164
Props,
165165
RawBindings,
166166
D,
@@ -211,7 +211,7 @@ export function defineComponent<
211211
II extends string = string,
212212
Props = Readonly<{ [key in PropNames]?: any }>
213213
>(
214-
comp: ComponentOptionsWithArrayProps<
214+
options: ComponentOptionsWithArrayProps<
215215
PropNames,
216216
RawBindings,
217217
D,
@@ -262,7 +262,7 @@ export function defineComponent<
262262
II extends string = string,
263263
Attrs extends AttrsType = {}
264264
>(
265-
comp: ComponentOptionsWithObjectProps<
265+
options: ComponentOptionsWithObjectProps<
266266
PropsOptions,
267267
RawBindings,
268268
D,

Diff for: ‎packages/runtime-core/src/apiSetupHelpers.ts

+3-4
Original file line numberDiff line numberDiff line change
@@ -11,8 +11,7 @@ import {
1111
setCurrentInstance,
1212
SetupContext,
1313
createSetupContext,
14-
unsetCurrentInstance,
15-
Data
14+
unsetCurrentInstance
1615
} from './component'
1716
import { EmitFn, EmitsOptions, ObjectEmitsOptions } from './componentEmits'
1817
import {
@@ -350,8 +349,8 @@ export function useSlots(): SetupContext['slots'] {
350349
return getContext().slots
351350
}
352351

353-
export function useAttrs<T extends Data = {}>(): SetupContext['attrs'] {
354-
return getContext().attrs as T
352+
export function useAttrs(): SetupContext['attrs'] {
353+
return getContext().attrs
355354
}
356355

357356
export function useModel<T extends Record<string, any>, K extends keyof T>(

Diff for: ‎packages/runtime-core/src/component.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -190,7 +190,7 @@ export type SetupContext<
190190
Attrs extends AttrsType = {}
191191
> = E extends any
192192
? {
193-
attrs: UnwrapAttrsType<Attrs>
193+
attrs: Partial<UnwrapAttrsType<Attrs>>
194194
slots: UnwrapSlotsType<S>
195195
emit: EmitFn<E>
196196
expose: (exposed?: Record<string, any>) => void

Diff for: ‎packages/runtime-core/src/componentPublicInstance.ts

+5-3
Original file line numberDiff line numberDiff line change
@@ -218,7 +218,7 @@ export type ComponentPublicInstance<
218218
Attrs extends AttrsType = {},
219219
PropsAttrs = IsSameType<UnwrapAttrsType<Attrs>, Data> extends true
220220
? {}
221-
: Omit<UnwrapAttrsType<Attrs>, keyof (P & PublicProps)>
221+
: Partial<Omit<UnwrapAttrsType<Attrs>, keyof (P & PublicProps)>>
222222
> = {
223223
$: ComponentInternalInstance
224224
$data: D
@@ -227,8 +227,10 @@ export type ComponentPublicInstance<
227227
? Partial<Defaults> & Omit<P & PublicProps, keyof Defaults> & PropsAttrs
228228
: P & PublicProps & PropsAttrs
229229
>
230-
$attrs: Omit<UnwrapAttrsType<Attrs>, keyof (P & PublicProps)> &
231-
AllowedComponentProps
230+
$attrs: Partial<
231+
Omit<UnwrapAttrsType<Attrs>, keyof (P & PublicProps)> &
232+
AllowedComponentProps
233+
>
232234
$refs: Data
233235
$slots: UnwrapSlotsType<S>
234236
$root: ComponentPublicInstance | null

0 commit comments

Comments
 (0)