render
- render /packages/runtime-core/src/renderer.ts
js
// 传入三个参数, vnode,挂载的真实dom节点,命名空间
const render: RootRenderFunction = (vnode, container, namespace) => {
if (vnode == null) {
// 如果没有传入vnode,并且container已经挂载了vnode,就先卸载之前的vnode
if (container._vnode) {
unmount(container._vnode, null, null, true)
}
} else {
// 上树
patch(
container._vnode || null,
vnode,
container,
null,
null,
null,
namespace,
)
}
// 暂时不清楚作用,后面研究
if (!isFlushing) {
isFlushing = true
flushPreFlushCbs()
flushPostFlushCbs()
isFlushing = false
}
container._vnode = vnode
}
- patch /packages/runtime-core/src/renderer.ts
js
type PatchFn = (
n1: VNode | null, // null means this is a mount
n2: VNode,
container: RendererElement,
anchor?: RendererNode | null,
parentComponent?: ComponentInternalInstance | null,
parentSuspense?: SuspenseBoundary | null,
namespace?: ElementNamespace,
slotScopeIds?: string[] | null,
optimized?: boolean,
) => void