mirror of
https://gitee.com/vuejs/vue.git
synced 2024-11-29 18:47:39 +08:00
fix(types): async Component types (#11906)
* Update options.d.ts * Create async-component-test.ts * add generics to Component ad EsModuleComponent * remove not needed , and ; * revert unrelated changes * revert unrelated changes * revert unrelated changes * revert unrelated changes * optimize EsModuleImports * Update async-component-test.ts
This commit is contained in:
parent
80e7730946
commit
c52427b0d2
15
types/options.d.ts
vendored
15
types/options.d.ts
vendored
@ -12,9 +12,10 @@ export type Component<Data=DefaultData<never>, Methods=DefaultMethods<never>, Co
|
||||
| FunctionalComponentOptions<Props>
|
||||
| ComponentOptions<never, Data, Methods, Computed, Props>
|
||||
|
||||
interface EsModuleComponent {
|
||||
default: Component
|
||||
}
|
||||
type EsModule<T> = T | { default: T }
|
||||
|
||||
type ImportedComponent<Data=DefaultData<never>, Methods=DefaultMethods<never>, Computed=DefaultComputed, Props=DefaultProps>
|
||||
= EsModule<Component<Data, Methods, Computed, Props>>
|
||||
|
||||
export type AsyncComponent<Data=DefaultData<never>, Methods=DefaultMethods<never>, Computed=DefaultComputed, Props=DefaultProps>
|
||||
= AsyncComponentPromise<Data, Methods, Computed, Props>
|
||||
@ -23,12 +24,12 @@ export type AsyncComponent<Data=DefaultData<never>, Methods=DefaultMethods<never
|
||||
export type AsyncComponentPromise<Data=DefaultData<never>, Methods=DefaultMethods<never>, Computed=DefaultComputed, Props=DefaultProps> = (
|
||||
resolve: (component: Component<Data, Methods, Computed, Props>) => void,
|
||||
reject: (reason?: any) => void
|
||||
) => Promise<Component | EsModuleComponent> | void;
|
||||
) => Promise<ImportedComponent<Data, Methods, Computed, Props>> | void;
|
||||
|
||||
export type AsyncComponentFactory<Data=DefaultData<never>, Methods=DefaultMethods<never>, Computed=DefaultComputed, Props=DefaultProps> = () => {
|
||||
component: AsyncComponentPromise<Data, Methods, Computed, Props>;
|
||||
loading?: Component | EsModuleComponent;
|
||||
error?: Component | EsModuleComponent;
|
||||
component: Promise<ImportedComponent<Data, Methods, Computed, Props>>;
|
||||
loading?: ImportedComponent;
|
||||
error?: ImportedComponent;
|
||||
delay?: number;
|
||||
timeout?: number;
|
||||
}
|
||||
|
44
types/test/async-component-test.ts
Normal file
44
types/test/async-component-test.ts
Normal file
@ -0,0 +1,44 @@
|
||||
import Vue, { AsyncComponent, Component } from "../index";
|
||||
|
||||
const a: AsyncComponent = () => ({
|
||||
component: new Promise<Component>((res, rej) => {
|
||||
res({ template: "" })
|
||||
})
|
||||
})
|
||||
|
||||
const b: AsyncComponent = () => ({
|
||||
// @ts-expect-error component has to be a Promise that resolves to a component
|
||||
component: () =>
|
||||
new Promise<Component>((res, rej) => {
|
||||
res({ template: "" })
|
||||
})
|
||||
})
|
||||
|
||||
const c: AsyncComponent = () =>
|
||||
new Promise<Component>((res, rej) => {
|
||||
res({
|
||||
template: ""
|
||||
})
|
||||
})
|
||||
|
||||
const d: AsyncComponent = () =>
|
||||
new Promise<{ default: Component }>((res, rej) => {
|
||||
res({
|
||||
default: {
|
||||
template: ""
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
const e: AsyncComponent = () => ({
|
||||
component: new Promise<{ default: Component }>((res, rej) => {
|
||||
res({
|
||||
default: {
|
||||
template: ""
|
||||
}
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
// Test that Vue.component accepts any AsyncComponent
|
||||
Vue.component("async-compponent1", a)
|
Loading…
Reference in New Issue
Block a user