From e698c8f49200b0982d6e3858de3f39a70d6a0546 Mon Sep 17 00:00:00 2001 From: Evan You Date: Tue, 9 Oct 2018 11:37:24 -0400 Subject: [PATCH] types: rename --- packages/core/src/component.ts | 26 +++++----- packages/core/src/componentComputed.ts | 6 +-- packages/core/src/componentOptions.ts | 8 +-- packages/core/src/componentProps.ts | 9 ++-- packages/core/src/componentProxy.ts | 10 ++-- packages/core/src/componentState.ts | 4 +- packages/core/src/componentUtils.ts | 54 +++++++++++-------- packages/core/src/componentWatch.ts | 8 +-- packages/core/src/createRenderer.ts | 69 +++++++++++++------------ packages/core/src/errorHandling.ts | 4 +- packages/core/src/optional/directive.ts | 6 +-- packages/core/src/optional/keepAlive.ts | 8 +-- packages/core/src/vdom.ts | 6 +-- 13 files changed, 118 insertions(+), 100 deletions(-) diff --git a/packages/core/src/component.ts b/packages/core/src/component.ts index 556ae9b2..c221a1dc 100644 --- a/packages/core/src/component.ts +++ b/packages/core/src/component.ts @@ -17,7 +17,7 @@ export interface ComponentClass extends Flatten { new

(): MergedComponent } -export type MergedComponent = D & P & MountedComponent +export type MergedComponent = D & P & ComponentInstance export interface FunctionalComponent

{ (props: Readonly

, slots: Slots, attrs: Data): any @@ -31,15 +31,15 @@ export type ComponentType = ComponentClass | FunctionalComponent // this interface is merged with the class type // to represent a mounted component -export interface MountedComponent

extends InternalComponent { +export interface ComponentInstance

extends InternalComponent { $vnode: MountedVNode $data: D $props: Readonly

$attrs: Data $computed: Data $slots: Slots - $root: MountedComponent - $children: MountedComponent[] + $root: ComponentInstance + $children: ComponentInstance[] $options: ComponentOptions data?(): Partial @@ -58,7 +58,7 @@ export interface MountedComponent

extends InternalComponent { errorCaptured?(): ( err: Error, type: ErrorTypes, - target: MountedComponent + target: ComponentInstance ) => boolean | void activated?(): void deactivated?(): void @@ -68,7 +68,7 @@ export interface MountedComponent

extends InternalComponent { $forceUpdate: () => void $nextTick: (fn: () => void) => Promise - _self: MountedComponent // on proxies only + _self: ComponentInstance // on proxies only } class InternalComponent { @@ -85,11 +85,11 @@ class InternalComponent { public $attrs: Data | null = null public $computed: Data | null = null public $slots: Slots | null = null - public $root: MountedComponent | null = null - public $parent: MountedComponent | null = null - public $children: MountedComponent[] = [] + public $root: ComponentInstance | null = null + public $parent: ComponentInstance | null = null + public $children: ComponentInstance[] = [] public $options: any - public $refs: Record = {} + public $refs: Record = {} public $proxy: any = null public $forceUpdate: (() => void) | null = null @@ -118,10 +118,10 @@ class InternalComponent { } $watch( - keyOrFn: string | (() => any), - cb: (newValue: any, oldValue: any) => void, + keyOrFn: string | ((this: this) => any), + cb: (this: this, newValue: any, oldValue: any) => void, options?: WatchOptions - ) { + ): () => void { return setupWatcher(this as any, keyOrFn, cb, options) } diff --git a/packages/core/src/componentComputed.ts b/packages/core/src/componentComputed.ts index 2a00fe9e..074adcc9 100644 --- a/packages/core/src/componentComputed.ts +++ b/packages/core/src/componentComputed.ts @@ -1,6 +1,6 @@ import { EMPTY_OBJ } from './utils' import { computed, stop, ComputedGetter } from '@vue/observer' -import { ComponentClass, MountedComponent } from './component' +import { ComponentClass, ComponentInstance } from './component' import { ComponentComputedOptions } from './componentOptions' const extractionCache: WeakMap< @@ -30,7 +30,7 @@ export function getComputedOptions( } export function initializeComputed( - instance: MountedComponent, + instance: ComponentInstance, computedOptions: ComponentComputedOptions | undefined ) { if (!computedOptions) { @@ -58,7 +58,7 @@ export function initializeComputed( ) } -export function teardownComputed(instance: MountedComponent) { +export function teardownComputed(instance: ComponentInstance) { const handles = instance._computedGetters if (handles !== null) { for (const key in handles) { diff --git a/packages/core/src/componentOptions.ts b/packages/core/src/componentOptions.ts index ab8c5194..eca1c8f9 100644 --- a/packages/core/src/componentOptions.ts +++ b/packages/core/src/componentOptions.ts @@ -1,4 +1,4 @@ -import { MergedComponent, MountedComponent } from './component' +import { MergedComponent, ComponentInstance } from './component' import { Slots } from './vdom' export type Data = Record @@ -38,15 +38,15 @@ export interface PropOptions { validator?(value: T): boolean } -export interface ComponentComputedOptions { +export interface ComponentComputedOptions { [key: string]: (this: This, c: any) => any } -export interface ComponentWatchOptions { +export interface ComponentWatchOptions { [key: string]: ComponentWatchOption } -export type ComponentWatchOption = +export type ComponentWatchOption = | WatchHandler | WatchHandler[] | WatchOptionsWithHandler diff --git a/packages/core/src/componentProps.ts b/packages/core/src/componentProps.ts index 0394fc69..17c42526 100644 --- a/packages/core/src/componentProps.ts +++ b/packages/core/src/componentProps.ts @@ -1,5 +1,5 @@ import { immutable, unwrap, lock, unlock } from '@vue/observer' -import { MountedComponent } from './component' +import { ComponentInstance } from './component' import { Data, ComponentPropsOptions, @@ -16,13 +16,16 @@ import { capitalize } from './utils' -export function initializeProps(instance: MountedComponent, data: Data | null) { +export function initializeProps( + instance: ComponentInstance, + data: Data | null +) { const { props, attrs } = resolveProps(data, instance.$options.props) instance.$props = immutable(props || {}) instance.$attrs = immutable(attrs || {}) } -export function updateProps(instance: MountedComponent, nextData: Data) { +export function updateProps(instance: ComponentInstance, nextData: Data) { // instance.$props and instance.$attrs are observables that should not be // replaced. Instead, we mutate them to match latest props, which will trigger // updates if any value that's been used in child component has changed. diff --git a/packages/core/src/componentProxy.ts b/packages/core/src/componentProxy.ts index e2387f8c..33dc6ff5 100644 --- a/packages/core/src/componentProxy.ts +++ b/packages/core/src/componentProxy.ts @@ -1,4 +1,4 @@ -import { MountedComponent } from './component' +import { ComponentInstance } from './component' const bindCache = new WeakMap() @@ -15,7 +15,7 @@ function getBoundMethod(fn: Function, target: any, receiver: any): Function { } const renderProxyHandlers = { - get(target: MountedComponent, key: string, receiver: any) { + get(target: ComponentInstance, key: string, receiver: any) { if (key === '_self') { return target } else if ( @@ -50,7 +50,7 @@ const renderProxyHandlers = { } }, set( - target: MountedComponent, + target: ComponentInstance, key: string, value: any, receiver: any @@ -77,6 +77,6 @@ const renderProxyHandlers = { } } -export function createRenderProxy(instance: any): MountedComponent { - return new Proxy(instance, renderProxyHandlers) as MountedComponent +export function createRenderProxy(instance: any): ComponentInstance { + return new Proxy(instance, renderProxyHandlers) as ComponentInstance } diff --git a/packages/core/src/componentState.ts b/packages/core/src/componentState.ts index 1adcd1d4..114f8113 100644 --- a/packages/core/src/componentState.ts +++ b/packages/core/src/componentState.ts @@ -1,8 +1,8 @@ import { EMPTY_OBJ } from './utils' -import { MountedComponent } from './component' +import { ComponentInstance } from './component' import { observable } from '@vue/observer' -export function initializeState(instance: MountedComponent) { +export function initializeState(instance: ComponentInstance) { if (instance.data) { instance._rawData = instance.data() instance.$data = observable(instance._rawData) diff --git a/packages/core/src/componentUtils.ts b/packages/core/src/componentUtils.ts index 44346970..740c4e2c 100644 --- a/packages/core/src/componentUtils.ts +++ b/packages/core/src/componentUtils.ts @@ -2,7 +2,7 @@ import { VNodeFlags } from './flags' import { EMPTY_OBJ } from './utils' import { h } from './h' import { VNode, MountedVNode, createFragment } from './vdom' -import { Component, MountedComponent, ComponentClass } from './component' +import { Component, ComponentInstance, ComponentClass } from './component' import { createTextVNode, cloneVNode } from './vdom' import { initializeState } from './componentState' import { initializeProps } from './componentProps' @@ -12,16 +12,16 @@ import { teardownComputed } from './componentComputed' import { initializeWatch, teardownWatch } from './componentWatch' -import { Data, ComponentOptions } from './componentOptions' +import { ComponentOptions } from './componentOptions' import { createRenderProxy } from './componentProxy' import { handleError, ErrorTypes } from './errorHandling' export function createComponentInstance( vnode: VNode, Component: ComponentClass, - parentComponent: MountedComponent | null -): MountedComponent { - const instance = (vnode.children = new Component()) as MountedComponent + parentComponent: ComponentInstance | null +): ComponentInstance { + const instance = (vnode.children = new Component()) as ComponentInstance instance.$parentVNode = vnode as MountedVNode // renderProxy @@ -50,10 +50,10 @@ export function createComponentInstance( instance.created.call(proxy) } - return instance as MountedComponent + return instance as ComponentInstance } -export function renderInstanceRoot(instance: MountedComponent): VNode { +export function renderInstanceRoot(instance: ComponentInstance): VNode { let vnode try { vnode = instance.render.call(instance.$proxy, h, { @@ -79,7 +79,7 @@ export function renderInstanceRoot(instance: MountedComponent): VNode { ) } -export function teardownComponentInstance(instance: MountedComponent) { +export function teardownComponentInstance(instance: ComponentInstance) { if (instance._unmounted) { return } @@ -97,7 +97,7 @@ export function teardownComponentInstance(instance: MountedComponent) { export function normalizeComponentRoot( vnode: any, componentVNode: VNode | null, - attrs: Data | void, + attrs: Record | void, inheritAttrs: boolean | void ): VNode { if (vnode == null) { @@ -141,8 +141,8 @@ export function normalizeComponentRoot( } export function shouldUpdateFunctionalComponent( - prevProps: Data | null, - nextProps: Data | null + prevProps: Record | null, + nextProps: Record | null ): boolean { if (prevProps === nextProps) { return false @@ -170,25 +170,31 @@ export function shouldUpdateFunctionalComponent( export function createComponentClassFromOptions( options: ComponentOptions ): ComponentClass { - class ObjectComponent extends Component { + class AnonymousComponent extends Component { constructor() { super() this.$options = options } } + const proto = AnonymousComponent.prototype as any for (const key in options) { const value = options[key] + // name -> displayName + if (__COMPAT__ && key === 'name') { + options.displayName = options.name + } if (typeof value === 'function') { - ;(ObjectComponent.prototype as any)[key] = - key === 'render' - ? function() { - return value.call(this, h) - } - : value + if (__COMPAT__ && key === 'render') { + proto[key] = function() { + return value.call(this, h) + } + } else { + proto[key] = value + } } if (key === 'computed') { const isGet = typeof value === 'function' - Object.defineProperty(ObjectComponent.prototype, key, { + Object.defineProperty(proto, key, { configurable: true, get: isGet ? value : value.get, set: isGet ? undefined : value.set @@ -196,9 +202,15 @@ export function createComponentClassFromOptions( } if (key === 'methods') { for (const method in value) { - ;(ObjectComponent.prototype as any)[method] = value[method] + if (__DEV__ && proto.hasOwnProperty(method)) { + console.warn( + `Object syntax contains method name that conflicts with ` + + `lifecycle hook: "${method}"` + ) + } + proto[method] = value[method] } } } - return ObjectComponent as ComponentClass + return AnonymousComponent as ComponentClass } diff --git a/packages/core/src/componentWatch.ts b/packages/core/src/componentWatch.ts index b86e5d99..5abbc62e 100644 --- a/packages/core/src/componentWatch.ts +++ b/packages/core/src/componentWatch.ts @@ -1,12 +1,12 @@ import { EMPTY_OBJ, NOOP } from './utils' -import { MountedComponent } from './component' +import { ComponentInstance } from './component' import { ComponentWatchOptions, WatchOptions } from './componentOptions' import { autorun, stop } from '@vue/observer' import { queueJob } from '@vue/scheduler' import { handleError, ErrorTypes } from './errorHandling' export function initializeWatch( - instance: MountedComponent, + instance: ComponentInstance, options: ComponentWatchOptions | undefined ) { if (options !== void 0) { @@ -26,7 +26,7 @@ export function initializeWatch( } export function setupWatcher( - instance: MountedComponent, + instance: ComponentInstance, keyOrFn: string | Function, cb: (newValue: any, oldValue: any) => void, options: WatchOptions = EMPTY_OBJ as WatchOptions @@ -87,7 +87,7 @@ export function setupWatcher( } } -export function teardownWatch(instance: MountedComponent) { +export function teardownWatch(instance: ComponentInstance) { if (instance._watchHandles !== null) { instance._watchHandles.forEach(stop) } diff --git a/packages/core/src/createRenderer.ts b/packages/core/src/createRenderer.ts index ee3dd6ee..f03acf09 100644 --- a/packages/core/src/createRenderer.ts +++ b/packages/core/src/createRenderer.ts @@ -12,7 +12,7 @@ import { VNodeChildren } from './vdom' import { - MountedComponent, + ComponentInstance, FunctionalComponent, ComponentClass } from './component' @@ -111,7 +111,7 @@ export function createRenderer(options: RendererOptions) { function mount( vnode: VNode, container: RenderNode | null, - parentComponent: MountedComponent | null, + parentComponent: ComponentInstance | null, isSVG: boolean, endNode: RenderNode | null ) { @@ -140,7 +140,7 @@ export function createRenderer(options: RendererOptions) { function mountArrayChildren( children: VNode[], container: RenderNode | null, - parentComponent: MountedComponent | null, + parentComponent: ComponentInstance | null, isSVG: boolean, endNode: RenderNode | null ) { @@ -156,7 +156,7 @@ export function createRenderer(options: RendererOptions) { function mountElement( vnode: VNode, container: RenderNode | null, - parentComponent: MountedComponent | null, + parentComponent: ComponentInstance | null, isSVG: boolean, endNode: RenderNode | null ) { @@ -198,7 +198,7 @@ export function createRenderer(options: RendererOptions) { } } - function mountRef(ref: Ref, el: RenderNode | MountedComponent) { + function mountRef(ref: Ref, el: RenderNode | ComponentInstance) { lifecycleHooks.push(() => { ref(el) }) @@ -207,7 +207,7 @@ export function createRenderer(options: RendererOptions) { function mountStatefulComponent( vnode: VNode, container: RenderNode | null, - parentComponent: MountedComponent | null, + parentComponent: ComponentInstance | null, isSVG: boolean, endNode: RenderNode | null ) { @@ -229,7 +229,7 @@ export function createRenderer(options: RendererOptions) { function mountFunctionalComponent( vnode: VNode, container: RenderNode | null, - parentComponent: MountedComponent | null, + parentComponent: ComponentInstance | null, isSVG: boolean, endNode: RenderNode | null ) { @@ -260,7 +260,7 @@ export function createRenderer(options: RendererOptions) { function mountFragment( vnode: VNode, container: RenderNode | null, - parentComponent: MountedComponent | null, + parentComponent: ComponentInstance | null, isSVG: boolean, endNode: RenderNode | null ) { @@ -290,7 +290,7 @@ export function createRenderer(options: RendererOptions) { function mountPortal( vnode: VNode, container: RenderNode | null, - parentComponent: MountedComponent | null + parentComponent: ComponentInstance | null ) { const { tag, children, childFlags, ref } = vnode const target = typeof tag === 'string' ? platformQuerySelector(tag) : tag @@ -354,7 +354,7 @@ export function createRenderer(options: RendererOptions) { prevVNode: MountedVNode, nextVNode: VNode, container: RenderNode, - parentComponent: MountedComponent | null, + parentComponent: ComponentInstance | null, isSVG: boolean ) { const nextFlags = nextVNode.flags @@ -379,7 +379,7 @@ export function createRenderer(options: RendererOptions) { prevVNode: MountedVNode, nextVNode: VNode, container: RenderNode, - parentComponent: MountedComponent | null, + parentComponent: ComponentInstance | null, isSVG: boolean ) { const { flags, tag } = nextVNode @@ -452,7 +452,7 @@ export function createRenderer(options: RendererOptions) { prevVNode: MountedVNode, nextVNode: VNode, container: RenderNode, - parentComponent: MountedComponent | null, + parentComponent: ComponentInstance | null, isSVG: boolean ) { const { tag, flags } = nextVNode @@ -480,7 +480,7 @@ export function createRenderer(options: RendererOptions) { } = nextVNode const instance = (nextVNode.children = - prevVNode.children) as MountedComponent + prevVNode.children) as ComponentInstance instance.$slots = nextSlots || EMPTY_OBJ instance.$parentVNode = nextVNode as MountedVNode @@ -508,7 +508,7 @@ export function createRenderer(options: RendererOptions) { prevVNode: MountedVNode, nextVNode: VNode, container: RenderNode, - parentComponent: MountedComponent | null, + parentComponent: ComponentInstance | null, isSVG: boolean ) { // functional component tree is stored on the vnode as `children` @@ -542,7 +542,7 @@ export function createRenderer(options: RendererOptions) { prevVNode: MountedVNode, nextVNode: VNode, container: RenderNode, - parentComponent: MountedComponent | null, + parentComponent: ComponentInstance | null, isSVG: boolean ) { // determine the tail node of the previous fragment, @@ -599,7 +599,7 @@ export function createRenderer(options: RendererOptions) { function patchPortal( prevVNode: MountedVNode, nextVNode: VNode, - parentComponent: MountedComponent | null + parentComponent: ComponentInstance | null ) { const prevContainer = prevVNode.tag as RenderNode const nextContainer = nextVNode.tag as RenderNode @@ -635,7 +635,7 @@ export function createRenderer(options: RendererOptions) { prevVNode: MountedVNode, nextVNode: VNode, container: RenderNode, - parentComponent: MountedComponent | null, + parentComponent: ComponentInstance | null, isSVG: boolean ) { const refNode = platformNextSibling(getVNodeLastEl(prevVNode)) @@ -649,7 +649,7 @@ export function createRenderer(options: RendererOptions) { prevChildren: VNodeChildren, nextChildren: VNodeChildren, container: RenderNode, - parentComponent: MountedComponent | null, + parentComponent: ComponentInstance | null, isSVG: boolean, endNode: RenderNode | null ) { @@ -769,7 +769,7 @@ export function createRenderer(options: RendererOptions) { container: RenderNode, prevLength: number, nextLength: number, - parentComponent: MountedComponent | null, + parentComponent: ComponentInstance | null, isSVG: boolean, endNode: RenderNode | null ) { @@ -807,7 +807,7 @@ export function createRenderer(options: RendererOptions) { container: RenderNode, prevLength: number, nextLength: number, - parentComponent: MountedComponent | null, + parentComponent: ComponentInstance | null, isSVG: boolean, endNode: RenderNode | null ) { @@ -1074,9 +1074,9 @@ export function createRenderer(options: RendererOptions) { } else if (flags & VNodeFlags.COMPONENT) { if (flags & VNodeFlags.COMPONENT_STATEFUL) { if (flags & VNodeFlags.COMPONENT_STATEFUL_SHOULD_KEEP_ALIVE) { - deactivateComponentInstance(children as MountedComponent) + deactivateComponentInstance(children as ComponentInstance) } else { - unmountComponentInstance(children as MountedComponent) + unmountComponentInstance(children as ComponentInstance) } } else { unmount(children as MountedVNode) @@ -1156,14 +1156,14 @@ export function createRenderer(options: RendererOptions) { parentVNode: VNode, Component: ComponentClass, container: RenderNode | null, - parentComponent: MountedComponent | null, + parentComponent: ComponentInstance | null, isSVG: boolean, endNode: RenderNode | null ): RenderNode { // a vnode may already have an instance if this is a compat call with // new Vue() const instance = - (__COMPAT__ && (parentVNode.children as MountedComponent)) || + (__COMPAT__ && (parentVNode.children as ComponentInstance)) || createComponentInstance(parentVNode, Component, parentComponent) // inject platform-specific unmount to keep-alive container @@ -1212,7 +1212,7 @@ export function createRenderer(options: RendererOptions) { } function mountComponentInstanceCallbacks( - instance: MountedComponent, + instance: ComponentInstance, ref: Ref | null ) { if (ref) { @@ -1225,7 +1225,10 @@ export function createRenderer(options: RendererOptions) { } } - function updateComponentInstance(instance: MountedComponent, isSVG: boolean) { + function updateComponentInstance( + instance: ComponentInstance, + isSVG: boolean + ) { const prevVNode = instance.$vnode if (instance.beforeUpdate) { @@ -1277,7 +1280,7 @@ export function createRenderer(options: RendererOptions) { } } - function unmountComponentInstance(instance: MountedComponent) { + function unmountComponentInstance(instance: ComponentInstance) { if (instance._unmounted) { return } @@ -1298,14 +1301,14 @@ export function createRenderer(options: RendererOptions) { // Keep Alive ---------------------------------------------------------------- function activateComponentInstance(vnode: VNode) { - const instance = vnode.children as MountedComponent + const instance = vnode.children as ComponentInstance vnode.el = instance.$el lifecycleHooks.push(() => { callActivatedHook(instance, true) }) } - function callActivatedHook(instance: MountedComponent, asRoot: boolean) { + function callActivatedHook(instance: ComponentInstance, asRoot: boolean) { // 1. check if we are inside an inactive parent tree. if (asRoot) { instance._inactiveRoot = false @@ -1323,11 +1326,11 @@ export function createRenderer(options: RendererOptions) { } } - function deactivateComponentInstance(instance: MountedComponent) { + function deactivateComponentInstance(instance: ComponentInstance) { callDeactivateHook(instance, true) } - function callDeactivateHook(instance: MountedComponent, asRoot: boolean) { + function callDeactivateHook(instance: ComponentInstance, asRoot: boolean) { if (asRoot) { instance._inactiveRoot = true if (isInInactiveTree(instance)) return @@ -1344,7 +1347,7 @@ export function createRenderer(options: RendererOptions) { } } - function isInInactiveTree(instance: MountedComponent): boolean { + function isInInactiveTree(instance: ComponentInstance): boolean { while ((instance = instance.$parent as any) !== null) { if (instance._inactiveRoot) return true } @@ -1376,7 +1379,7 @@ export function createRenderer(options: RendererOptions) { } flushHooks() return vnode && vnode.flags & VNodeFlags.COMPONENT_STATEFUL - ? (vnode.children as MountedComponent).$proxy + ? (vnode.children as ComponentInstance).$proxy : null } diff --git a/packages/core/src/errorHandling.ts b/packages/core/src/errorHandling.ts index b6d040f7..c740457f 100644 --- a/packages/core/src/errorHandling.ts +++ b/packages/core/src/errorHandling.ts @@ -1,4 +1,4 @@ -import { MountedComponent } from './component' +import { ComponentInstance } from './component' export const enum ErrorTypes { BEFORE_CREATE = 1, @@ -36,7 +36,7 @@ const ErrorTypeStrings: Record = { export function handleError( err: Error, - instance: MountedComponent, + instance: ComponentInstance, type: ErrorTypes ) { let cur = instance diff --git a/packages/core/src/optional/directive.ts b/packages/core/src/optional/directive.ts index 9d076b1b..6dbdf077 100644 --- a/packages/core/src/optional/directive.ts +++ b/packages/core/src/optional/directive.ts @@ -1,8 +1,8 @@ import { VNode } from '../vdom' -import { MountedComponent } from '../component' +import { ComponentInstance } from '../component' interface DirectiveBinding { - instance: MountedComponent + instance: ComponentInstance value?: any oldValue?: any arg?: string @@ -32,7 +32,7 @@ const valueCache = new WeakMap>() export function applyDirective( vnode: VNode, directive: Directive, - instance: MountedComponent, + instance: ComponentInstance, value?: any, arg?: string, modifiers?: DirectiveModifiers diff --git a/packages/core/src/optional/keepAlive.ts b/packages/core/src/optional/keepAlive.ts index 1525b37d..17d6a198 100644 --- a/packages/core/src/optional/keepAlive.ts +++ b/packages/core/src/optional/keepAlive.ts @@ -1,4 +1,4 @@ -import { Component, ComponentClass, MountedComponent } from '../component' +import { Component, ComponentClass, ComponentInstance } from '../component' import { VNode, Slots, cloneVNode } from '../vdom' import { VNodeFlags } from '../flags' @@ -20,13 +20,13 @@ export class KeepAlive extends Component { keys: Set = new Set() // to be set in createRenderer when instance is created - $unmount: (instance: MountedComponent) => void + $unmount: (instance: ComponentInstance) => void beforeUnmount() { this.cache.forEach(vnode => { // change flag so it can be properly unmounted vnode.flags = VNodeFlags.COMPONENT_STATEFUL_NORMAL - this.$unmount(vnode.children as MountedComponent) + this.$unmount(vnode.children as ComponentInstance) }) } @@ -43,7 +43,7 @@ export class KeepAlive extends Component { const cached = this.cache.get(key) as VNode const current = this.$vnode if (!current || cached.tag !== current.tag) { - this.$unmount(cached.children as MountedComponent) + this.$unmount(cached.children as ComponentInstance) } this.cache.delete(key) this.keys.delete(key) diff --git a/packages/core/src/vdom.ts b/packages/core/src/vdom.ts index 14b85f74..989ce275 100644 --- a/packages/core/src/vdom.ts +++ b/packages/core/src/vdom.ts @@ -1,5 +1,5 @@ import { - MountedComponent, + ComponentInstance, ComponentClass, FunctionalComponent } from './component' @@ -46,7 +46,7 @@ export interface VNodeData { export type VNodeChildren = | VNode[] // ELEMENT | PORTAL - | MountedComponent // COMPONENT_STATEFUL + | ComponentInstance // COMPONENT_STATEFUL | VNode // COMPONENT_FUNCTIONAL | string // TEXT | null @@ -55,7 +55,7 @@ export type RawVNodeChildren = VNodeChildren | unknown[] export type Key = string | number -export type Ref = (t: RenderNode | MountedComponent | null) => void +export type Ref = (t: RenderNode | ComponentInstance | null) => void export type Slot = (...args: any[]) => VNode[]