diff --git a/packages/core/src/component.ts b/packages/core/src/component.ts index 984693d1..d08ce976 100644 --- a/packages/core/src/component.ts +++ b/packages/core/src/component.ts @@ -1,4 +1,4 @@ -import { EMPTY_OBJ } from './utils' +import { EMPTY_OBJ, NOOP } from './utils' import { VNode, Slots, RenderNode, MountedVNode } from './vdom' import { Data, @@ -13,37 +13,43 @@ import { nextTick } from '@vue/scheduler' import { ErrorTypes } from './errorHandling' import { initializeComponentInstance } from './componentUtils' -export interface ComponentClass extends ComponentClassOptions { - options?: ComponentOptions - new
(): MergedComponent
+// public component instance type +export interface Component
extends PublicInstanceMethods { + readonly $el: any + readonly $vnode: MountedVNode + readonly $parentVNode: MountedVNode + readonly $data: D + readonly $props: Readonly
+ readonly $attrs: Readonly
+ readonly $slots: Slots
+ readonly $root: Component
+ readonly $parent: Component
+ readonly $children: Component[]
+ readonly $options: ComponentOptions
+ readonly $refs: Record = D & P & ComponentInstance
-
-export interface FunctionalComponent {
- (props: P, slots: Slots, attrs: Data): any
- pure?: boolean
- props?: ComponentPropsOptions
- displayName?: string
+interface PublicInstanceMethods {
+ $forceUpdate(): void
+ $nextTick(fn: () => any): Promise extends InternalComponent {
- constructor: ComponentClass
-
- $vnode: MountedVNode
- $data: D
- $props: Readonly
- $attrs: Data
- $slots: Slots
- $root: ComponentInstance
- $children: ComponentInstance[]
-
+interface APIMethods {
data?(): Partial , slots: Slots, attrs: Data): any
- renderTracked?(e: DebuggerEvent): void
- renderTriggered?(e: DebuggerEvent): void
+}
+
+interface LifecycleMethods {
beforeCreate?(): void
created?(): void
beforeMount?(): void
@@ -60,50 +66,83 @@ export interface ComponentInstance extends InternalComponent {
) => boolean | void
activated?(): void
deactivated?(): void
+ renderTracked?(e: DebuggerEvent): void
+ renderTriggered?(e: DebuggerEvent): void
+}
+
+export interface ComponentClass extends ComponentClassOptions {
+ options?: ComponentOptions
+ new (): Component & D & P
+}
+
+export interface FunctionalComponent {
+ (props: P, slots: Slots, attrs: Data): any
+ pure?: boolean
+ props?: ComponentPropsOptions
+ displayName?: string
+}
+
+export type ComponentType = ComponentClass | FunctionalComponent
+
+// Internal type that represents a mounted instance.
+// It extends InternalComponent with mounted instance properties.
+export interface ComponentInstance
+ extends InternalComponent,
+ APIMethods ,
+ LifecycleMethods {
+ constructor: ComponentClass
+
+ $vnode: MountedVNode
+ $data: D
+ $props: P
+ $attrs: Data
+ $slots: Slots
+ $root: ComponentInstance
+ $children: ComponentInstance[]
_updateHandle: Autorun
_queueJob: ((fn: () => void) => void)
- $forceUpdate: () => void
- $nextTick: (fn: () => void) => Promise {
displayName?: string
}
-export interface ComponentOptions >
+export interface ComponentOptions >
extends ComponentClassOptions {
data?(): D
render?: (this: This, props: Readonly, slots: Slots, attrs: Data) => any
diff --git a/packages/core/src/componentUtils.ts b/packages/core/src/componentUtils.ts
index 2950f67c..04a8808b 100644
--- a/packages/core/src/componentUtils.ts
+++ b/packages/core/src/componentUtils.ts
@@ -39,7 +39,7 @@ export function createComponentInstance(
// always pass args in super()
currentVNode = vnode
currentContextVNode = contextVNode
- const instance = (vnode.children = new Component()) as ComponentInstance
+ const instance = (vnode.children = new Component() as ComponentInstance)
// then we finish the initialization by collecting properties set on the
// instance
initializeState(instance)
diff --git a/packages/core/src/h.ts b/packages/core/src/h.ts
index c07e11f4..9d4bcb97 100644
--- a/packages/core/src/h.ts
+++ b/packages/core/src/h.ts
@@ -1,9 +1,5 @@
import { ChildrenFlags } from './flags'
-import {
- ComponentClass,
- FunctionalComponent,
- ComponentInstance
-} from './component'
+import { ComponentClass, FunctionalComponent, Component } from './component'
import { ComponentOptions } from './componentOptions'
import {
VNode,
@@ -93,9 +89,9 @@ interface createElement extends VNodeFactories {
children?: RawChildrenType | RawSlots
): VNode
// class
- (tag: new () => ComponentInstance , children?: RawChildrenType): VNode
+ (tag: new () => Component , children?: RawChildrenType): VNode
(
- tag: new () => ComponentInstance ,
+ tag: new () => Component ,
data?: (P & BuiltInProps & Differ) | null,
children?: RawChildrenType | RawSlots
): VNode
diff --git a/packages/core/src/index.ts b/packages/core/src/index.ts
index 2feec952..6c2d323c 100644
--- a/packages/core/src/index.ts
+++ b/packages/core/src/index.ts
@@ -24,12 +24,7 @@ export { createAsyncComponent } from './optional/asyncComponent'
export { KeepAlive } from './optional/keepAlive'
// flags & types
-export {
- ComponentType,
- ComponentClass,
- FunctionalComponent,
- ComponentInstance
-} from './component'
+export { ComponentType, ComponentClass, FunctionalComponent } from './component'
export * from './componentOptions'
export { VNodeFlags, ChildrenFlags } from './flags'
export { VNode, Slots } from './vdom'
diff --git a/packages/core/src/vdom.ts b/packages/core/src/vdom.ts
index 811f7b26..3db116df 100644
--- a/packages/core/src/vdom.ts
+++ b/packages/core/src/vdom.ts
@@ -56,6 +56,7 @@ export type VNodeChildren =
| ComponentInstance // COMPONENT_STATEFUL
| VNode // COMPONENT_FUNCTIONAL
| string // TEXT
+ | null
export type Key = string | number