types: rename
This commit is contained in:
parent
d22b71b27e
commit
e698c8f492
@ -17,7 +17,7 @@ export interface ComponentClass extends Flatten<typeof InternalComponent> {
|
||||
new <P extends object = {}, D extends object = {}>(): MergedComponent<P, D>
|
||||
}
|
||||
|
||||
export type MergedComponent<P, D> = D & P & MountedComponent<P, D>
|
||||
export type MergedComponent<P, D> = D & P & ComponentInstance<P, D>
|
||||
|
||||
export interface FunctionalComponent<P = {}> {
|
||||
(props: Readonly<P>, 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<P = {}, D = {}> extends InternalComponent {
|
||||
export interface ComponentInstance<P = {}, D = {}> extends InternalComponent {
|
||||
$vnode: MountedVNode
|
||||
$data: D
|
||||
$props: Readonly<P>
|
||||
$attrs: Data
|
||||
$computed: Data
|
||||
$slots: Slots
|
||||
$root: MountedComponent
|
||||
$children: MountedComponent[]
|
||||
$root: ComponentInstance
|
||||
$children: ComponentInstance[]
|
||||
$options: ComponentOptions<P, D>
|
||||
|
||||
data?(): Partial<D>
|
||||
@ -58,7 +58,7 @@ export interface MountedComponent<P = {}, D = {}> extends InternalComponent {
|
||||
errorCaptured?(): (
|
||||
err: Error,
|
||||
type: ErrorTypes,
|
||||
target: MountedComponent
|
||||
target: ComponentInstance
|
||||
) => boolean | void
|
||||
activated?(): void
|
||||
deactivated?(): void
|
||||
@ -68,7 +68,7 @@ export interface MountedComponent<P = {}, D = {}> extends InternalComponent {
|
||||
$forceUpdate: () => void
|
||||
$nextTick: (fn: () => void) => Promise<any>
|
||||
|
||||
_self: MountedComponent<D, P> // on proxies only
|
||||
_self: ComponentInstance<D, P> // 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<string, MountedComponent | RenderNode> = {}
|
||||
public $refs: Record<string, ComponentInstance | RenderNode> = {}
|
||||
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)
|
||||
}
|
||||
|
||||
|
@ -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) {
|
||||
|
@ -1,4 +1,4 @@
|
||||
import { MergedComponent, MountedComponent } from './component'
|
||||
import { MergedComponent, ComponentInstance } from './component'
|
||||
import { Slots } from './vdom'
|
||||
|
||||
export type Data = Record<string, any>
|
||||
@ -38,15 +38,15 @@ export interface PropOptions<T = any> {
|
||||
validator?(value: T): boolean
|
||||
}
|
||||
|
||||
export interface ComponentComputedOptions<This = MountedComponent> {
|
||||
export interface ComponentComputedOptions<This = ComponentInstance> {
|
||||
[key: string]: (this: This, c: any) => any
|
||||
}
|
||||
|
||||
export interface ComponentWatchOptions<This = MountedComponent> {
|
||||
export interface ComponentWatchOptions<This = ComponentInstance> {
|
||||
[key: string]: ComponentWatchOption<This>
|
||||
}
|
||||
|
||||
export type ComponentWatchOption<This = MountedComponent> =
|
||||
export type ComponentWatchOption<This = ComponentInstance> =
|
||||
| WatchHandler<This>
|
||||
| WatchHandler<This>[]
|
||||
| WatchOptionsWithHandler<This>
|
||||
|
@ -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.
|
||||
|
@ -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<any, any>, key: string, receiver: any) {
|
||||
get(target: ComponentInstance<any, any>, key: string, receiver: any) {
|
||||
if (key === '_self') {
|
||||
return target
|
||||
} else if (
|
||||
@ -50,7 +50,7 @@ const renderProxyHandlers = {
|
||||
}
|
||||
},
|
||||
set(
|
||||
target: MountedComponent<any, any>,
|
||||
target: ComponentInstance<any, any>,
|
||||
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
|
||||
}
|
||||
|
@ -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)
|
||||
|
@ -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<string, any> | 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<string, any> | null,
|
||||
nextProps: Record<string, any> | 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() {
|
||||
if (__COMPAT__ && key === 'render') {
|
||||
proto[key] = function() {
|
||||
return value.call(this, h)
|
||||
}
|
||||
: value
|
||||
} 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
|
||||
}
|
||||
|
@ -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)
|
||||
}
|
||||
|
@ -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
|
||||
}
|
||||
|
||||
|
@ -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<number, string> = {
|
||||
|
||||
export function handleError(
|
||||
err: Error,
|
||||
instance: MountedComponent,
|
||||
instance: ComponentInstance,
|
||||
type: ErrorTypes
|
||||
) {
|
||||
let cur = instance
|
||||
|
@ -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<Directive, WeakMap<any, any>>()
|
||||
export function applyDirective(
|
||||
vnode: VNode,
|
||||
directive: Directive,
|
||||
instance: MountedComponent,
|
||||
instance: ComponentInstance,
|
||||
value?: any,
|
||||
arg?: string,
|
||||
modifiers?: DirectiveModifiers
|
||||
|
@ -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<KeepAliveProps> {
|
||||
keys: Set<CacheKey> = 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<KeepAliveProps> {
|
||||
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)
|
||||
|
@ -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[]
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user