theluyuan/vue3-yuanma
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

wip: hoc parent el update

Browse Source
This commit is contained in:
Evan You 2019-06-03 12:40:21 +08:00
parent 7fe82b1199
commit 0ad31f29c4
1 changed files with 20 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
packages/runtime-core/src/createRenderer.ts
View File

@ -542,25 +542,25 @@ export function createRenderer(options: RendererOptions) {
} }
function mountComponent( function mountComponent(
vnode: VNode, initialVNode: VNode,
container: HostNode, container: HostNode,
anchor: HostNode, anchor: HostNode,
parentComponent: ComponentInstance | null, parentComponent: ComponentInstance | null,
isSVG: boolean isSVG: boolean
) { ) {
const Component = vnode.type as any const Component = initialVNode.type as any
const instance: ComponentInstance = (vnode.component = createComponentInstance( const instance: ComponentInstance = (initialVNode.component = createComponentInstance(
Component, Component,
parentComponent parentComponent
)) ))
instance.update = effect(function updateComponent() { instance.update = effect(function updateComponent() {
if (instance.vnode === null) { if (instance.vnode === null) {
// initial mount // initial mount
instance.vnode = vnode instance.vnode = initialVNode
resolveProps(instance, vnode.props, Component.props) resolveProps(instance, initialVNode.props, Component.props)
resolveSlots(instance, vnode.children) resolveSlots(instance, initialVNode.children)
// setup stateful // setup stateful
if (vnode.shapeFlag & STATEFUL_COMPONENT) { if (initialVNode.shapeFlag & STATEFUL_COMPONENT) {
setupStatefulComponent(instance) setupStatefulComponent(instance)
} }
const subTree = (instance.subTree = renderComponentRoot(instance)) const subTree = (instance.subTree = renderComponentRoot(instance))
@ -569,7 +569,7 @@ export function createRenderer(options: RendererOptions) {
invokeHooks(instance.bm) invokeHooks(instance.bm)
} }
patch(null, subTree, container, anchor, instance, isSVG) patch(null, subTree, container, anchor, instance, isSVG)
vnode.el = subTree.el initialVNode.el = subTree.el
// mounted hook // mounted hook
if (instance.m !== null) { if (instance.m !== null) {
queuePostFlushCb(instance.m) queuePostFlushCb(instance.m)
@ -580,6 +580,7 @@ export function createRenderer(options: RendererOptions) {
// OR parent calling processComponent (next: VNode) // OR parent calling processComponent (next: VNode)
const { next } = instance const { next } = instance
if (next !== null) { if (next !== null) {
// update from parent
next.component = instance next.component = instance
instance.vnode = next instance.vnode = next
instance.next = null instance.next = null
@ -601,10 +602,17 @@ export function createRenderer(options: RendererOptions) {
instance, instance,
isSVG isSVG
) )
if (next !== null) { let current = instance.vnode
next.el = nextTree.el current.el = nextTree.el
} else { if (next === null) {
// TODO in case of HOC, update parent component vnode el // self-triggered update. In case of HOC, update parent component
// vnode el. HOC is indicated by parent instance's subTree pointing
// to child component's vnode
let parent = instance.parent
while (parent && parent.subTree === current) {
;(current = parent.vnode).el = nextTree.el
parent = parent.parent
}
} }
// upated hook // upated hook
if (instance.u !== null) { if (instance.u !== null) {