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

refactor: mount doesn't have to return el

Browse Source
This commit is contained in:
Evan You 2018-10-02 12:15:08 -04:00
parent 5e988cc9fd
commit 0ae6d8ab8b
1 changed files with 21 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

48
packages/core/src/createRenderer.ts
View File

@ -177,20 +177,18 @@ export function createRenderer(options: RendererOptions) {
parentComponent: MountedComponent | null, parentComponent: MountedComponent | null,
isSVG: boolean, isSVG: boolean,
endNode: RenderNode | RenderFragment | null endNode: RenderNode | RenderFragment | null
): RenderNode | RenderFragment { ) {
const { flags } = vnode const { flags } = vnode
if (flags & VNodeFlags.ELEMENT) { if (flags & VNodeFlags.ELEMENT) {
return mountElement(vnode, container, parentComponent, isSVG, endNode) mountElement(vnode, container, parentComponent, isSVG, endNode)
} else if (flags & VNodeFlags.COMPONENT) { } else if (flags & VNodeFlags.COMPONENT) {
return mountComponent(vnode, container, parentComponent, isSVG, endNode) mountComponent(vnode, container, parentComponent, isSVG, endNode)
} else if (flags & VNodeFlags.TEXT) { } else if (flags & VNodeFlags.TEXT) {
return mountText(vnode, container, endNode) mountText(vnode, container, endNode)
} else if (flags & VNodeFlags.FRAGMENT) { } else if (flags & VNodeFlags.FRAGMENT) {
return mountFragment(vnode, container, parentComponent, isSVG, endNode) mountFragment(vnode, container, parentComponent, isSVG, endNode)
} else if (flags & VNodeFlags.PORTAL) { } else if (flags & VNodeFlags.PORTAL) {
return mountPortal(vnode, container, parentComponent) mountPortal(vnode, container, parentComponent)
} else {
return platformCreateText('')
} }
} }
@ -216,7 +214,7 @@ export function createRenderer(options: RendererOptions) {
parentComponent: MountedComponent | null, parentComponent: MountedComponent | null,
isSVG: boolean, isSVG: boolean,
endNode: RenderNode | RenderFragment | null endNode: RenderNode | RenderFragment | null
): RenderNode { ) {
const { flags, tag, data, children, childFlags, ref } = vnode const { flags, tag, data, children, childFlags, ref } = vnode
isSVG = isSVG || (flags & VNodeFlags.ELEMENT_SVG) > 0 isSVG = isSVG || (flags & VNodeFlags.ELEMENT_SVG) > 0
const el = (vnode.el = platformCreateElement(tag as string, isSVG)) const el = (vnode.el = platformCreateElement(tag as string, isSVG))
@ -253,7 +251,6 @@ export function createRenderer(options: RendererOptions) {
data.vnodeMounted(vnode) data.vnodeMounted(vnode)
}) })
} }
return el
} }
function mountRef(ref: Ref, el: RenderNode | MountedComponent) { function mountRef(ref: Ref, el: RenderNode | MountedComponent) {
@ -268,7 +265,7 @@ export function createRenderer(options: RendererOptions) {
parentComponent: MountedComponent | null, parentComponent: MountedComponent | null,
isSVG: boolean, isSVG: boolean,
endNode: RenderNode | RenderFragment | null endNode: RenderNode | RenderFragment | null
): RenderNode | RenderFragment { ) {
let el: RenderNode | RenderFragment let el: RenderNode | RenderFragment
const { flags, tag, data, slots } = vnode const { flags, tag, data, slots } = vnode
if (flags & VNodeFlags.COMPONENT_STATEFUL) { if (flags & VNodeFlags.COMPONENT_STATEFUL) {
@ -295,12 +292,12 @@ export function createRenderer(options: RendererOptions) {
attrs, attrs,
render.inheritAttrs render.inheritAttrs
)) ))
el = vnode.el = mount(subTree, null, parentComponent, isSVG, endNode) mount(subTree, null, parentComponent, isSVG, endNode)
el = vnode.el = subTree.el as RenderNode
} }
if (container != null) { if (container != null) {
insertOrAppend(container, el, endNode) insertOrAppend(container, el, endNode)
} }
return el
} }
function mountText( function mountText(
@ -329,9 +326,8 @@ export function createRenderer(options: RendererOptions) {
}) })
const fragmentChildren = fragment.children const fragmentChildren = fragment.children
if (childFlags & ChildrenFlags.SINGLE_VNODE) { if (childFlags & ChildrenFlags.SINGLE_VNODE) {
fragmentChildren.push( mount(children as VNode, container, parentComponent, isSVG, endNode)
mount(children as VNode, container, parentComponent, isSVG, endNode) fragmentChildren.push((children as VNode).el as RenderNode)
)
} else if (childFlags & ChildrenFlags.MULTIPLE_VNODES) { } else if (childFlags & ChildrenFlags.MULTIPLE_VNODES) {
mountArrayChildren( mountArrayChildren(
children as VNode[], children as VNode[],
@ -346,7 +342,9 @@ export function createRenderer(options: RendererOptions) {
} else { } else {
// ensure at least one children so that it can be used as a ref node // ensure at least one children so that it can be used as a ref node
// during insertions // during insertions
fragmentChildren.push(mountText(createTextVNode(''), container, endNode)) const vnode = createTextVNode('')
mountText(vnode, container, endNode)
fragmentChildren.push(vnode.el as RenderNode)
} }
return fragment return fragment
} }
@ -355,7 +353,7 @@ export function createRenderer(options: RendererOptions) {
vnode: VNode, vnode: VNode,
container: RenderNode | null, container: RenderNode | null,
parentComponent: MountedComponent | null parentComponent: MountedComponent | null
): RenderNode { ) {
const { tag, children, childFlags, ref } = vnode const { tag, children, childFlags, ref } = vnode
const target = typeof tag === 'string' ? platformQuerySelector(tag) : tag const target = typeof tag === 'string' ? platformQuerySelector(tag) : tag
@ -383,7 +381,7 @@ export function createRenderer(options: RendererOptions) {
if (ref) { if (ref) {
mountRef(ref, target as RenderNode) mountRef(ref, target as RenderNode)
} }
return (vnode.el = mountText(createTextVNode(''), container, null)) vnode.el = mountText(createTextVNode(''), container, null)
} }
// patching ------------------------------------------------------------------ // patching ------------------------------------------------------------------
@ -690,10 +688,11 @@ export function createRenderer(options: RendererOptions) {
isSVG: boolean isSVG: boolean
) { ) {
unmount(prevVNode) unmount(prevVNode)
mount(nextVNode, null, parentComponent, isSVG, null)
replaceChild( replaceChild(
container, container,
prevVNode.el as RenderNode | RenderFragment, prevVNode.el as RenderNode | RenderFragment,
mount(nextVNode, null, parentComponent, isSVG, null) nextVNode.el as RenderNode
) )
} }
@ -1200,13 +1199,8 @@ export function createRenderer(options: RendererOptions) {
} else { } else {
// this will be executed synchronously right here // this will be executed synchronously right here
instance.$vnode = renderInstanceRoot(instance) instance.$vnode = renderInstanceRoot(instance)
parentVNode.el = mount( mount(instance.$vnode, container, instance, isSVG, endNode)
instance.$vnode, parentVNode.el = instance.$vnode.el
container,
instance,
isSVG,
endNode
)
instance._mounted = true instance._mounted = true
mountComponentInstanceCallbacks(instance, parentVNode.ref) mountComponentInstanceCallbacks(instance, parentVNode.ref)
} }