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

wip: fix reactivity boundary between components

Browse Source
This commit is contained in:
Evan You 2019-05-28 14:43:23 +08:00
parent b69ea00f5c
commit 7a92ee04a0
1 changed files with 28 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -320,7 +320,13 @@ export function createRenderer(options: RendererOptions) {
if (n1 == null) { if (n1 == null) {
mountComponent(n2, container, anchor) mountComponent(n2, container, anchor)
} else { } else {
updateComponent(n1.component, n2, container, anchor) const instance = (n2.component = n1.component)
if (shouldUpdateComponent(n1, n2)) {
instance.next = n2
instance.forceUpdate()
} else {
n2.el = n1.el
}
} }
} }
@ -331,12 +337,13 @@ export function createRenderer(options: RendererOptions) {
) { ) {
const instance = (vnode.component = { const instance = (vnode.component = {
vnode: null, vnode: null,
next: null,
subTree: null, subTree: null,
updateHandle: null, forceUpdate: null,
render: vnode.type render: vnode.type
} as any) } as any)
instance.updateHandle = effect( instance.forceUpdate = effect(
() => { () => {
if (!instance.vnode) { if (!instance.vnode) {
// initial mount // initial mount
@ -345,7 +352,8 @@ export function createRenderer(options: RendererOptions) {
patch(null, subTree, container, anchor) patch(null, subTree, container, anchor)
vnode.el = subTree.el vnode.el = subTree.el
} else { } else {
updateComponent(instance, vnode) // this is triggered by processComponent with `next` already set
updateComponent(instance)
} }
}, },
{ {
@ -356,23 +364,25 @@ export function createRenderer(options: RendererOptions) {
function updateComponent( function updateComponent(
instance: any, instance: any,
next: VNode,
container?: HostNode, container?: HostNode,
anchor?: HostNode anchor?: HostNode
) { ) {
const prev = instance.vnode const { next: vnode } = instance
instance.vnode = next if (vnode != null) {
next.component = instance vnode.component = instance
if (shouldUpdateComponent(prev, next)) { instance.vnode = vnode
const prevTree = instance.subTree instance.next = null
const nextTree = (instance.subTree = renderComponentRoot(instance)) }
patch( const prevTree = instance.subTree
prevTree, const nextTree = (instance.subTree = renderComponentRoot(instance))
nextTree, patch(
container || hostParentNode(prevTree.el), prevTree,
anchor || getNextHostNode(prevTree) nextTree,
) container || hostParentNode(prevTree.el),
next.el = nextTree.el anchor || getNextHostNode(prevTree)
)
if (vnode != null) {
vnode.el = nextTree.el
} }
} }