From 7a3a5850dc7e6328f4da86fb1c0f220da18c6934 Mon Sep 17 00:00:00 2001 From: Evan You Date: Tue, 28 May 2019 19:59:54 +0800 Subject: [PATCH] wip: adjust lifecycle --- .../runtime-core/src/componentLifecycle.ts | 1 + packages/runtime-core/src/createRenderer.ts | 21 +++++++++++-------- packages/runtime-core/src/scheduler.ts | 21 ++----------------- 3 files changed, 15 insertions(+), 28 deletions(-) diff --git a/packages/runtime-core/src/componentLifecycle.ts b/packages/runtime-core/src/componentLifecycle.ts index 29827a5e..2b0ed9d1 100644 --- a/packages/runtime-core/src/componentLifecycle.ts +++ b/packages/runtime-core/src/componentLifecycle.ts @@ -7,6 +7,7 @@ function injectHook( ) { if (target) { const existing = target[name] + // TODO inject a error-handling wrapped version of the hook if (existing !== null) { existing.push(hook) } else { diff --git a/packages/runtime-core/src/createRenderer.ts b/packages/runtime-core/src/createRenderer.ts index 2b381e43..3ec66d67 100644 --- a/packages/runtime-core/src/createRenderer.ts +++ b/packages/runtime-core/src/createRenderer.ts @@ -1,5 +1,5 @@ // TODO: -// - lifecycle / refs +// - refs // - slots // - keep alive // - app context @@ -28,17 +28,18 @@ import { shouldUpdateComponent, createComponentInstance } from './component' -import { - queueJob, - queuePostFlushCb, - flushPostFlushCbs, - queueReversePostFlushCb -} from './scheduler' +import { queueJob, queuePostFlushCb, flushPostFlushCbs } from './scheduler' function isSameType(n1: VNode, n2: VNode): boolean { return n1.type === n2.type && n1.key === n2.key } +function invokeHooks(hooks: Function[]) { + for (let i = 0; i < hooks.length; i++) { + hooks[i]() + } +} + export type HostNode = any export interface RendererOptions { @@ -364,6 +365,9 @@ export function createRenderer(options: RendererOptions) { // initial mount instance.vnode = vnode const subTree = (instance.subTree = renderComponentRoot(instance)) + if (instance.bm !== null) { + invokeHooks(instance.bm) + } patch(null, subTree, container, anchor) vnode.el = subTree.el // mounted hook @@ -391,8 +395,7 @@ export function createRenderer(options: RendererOptions) { } // upated hook if (instance.u !== null) { - // updated hooks are queued top-down, but should be fired bottom up - queueReversePostFlushCb(instance.u) + queuePostFlushCb(instance.u) } } }, diff --git a/packages/runtime-core/src/scheduler.ts b/packages/runtime-core/src/scheduler.ts index bf37774c..978e5320 100644 --- a/packages/runtime-core/src/scheduler.ts +++ b/packages/runtime-core/src/scheduler.ts @@ -1,6 +1,5 @@ const queue: Function[] = [] const postFlushCbs: Function[] = [] -const reversePostFlushCbs: Function[] = [] const p = Promise.resolve() let isFlushing = false @@ -20,32 +19,16 @@ export function queueJob(job: () => void, onError?: (err: Error) => void) { } export function queuePostFlushCb(cb: Function | Function[]) { - queuePostCb(cb, postFlushCbs) -} - -export function queueReversePostFlushCb(cb: Function | Function[]) { - queuePostCb(cb, reversePostFlushCbs) -} - -function queuePostCb(cb: Function | Function[], queue: Function[]) { if (Array.isArray(cb)) { - queue.push.apply(postFlushCbs, cb) + postFlushCbs.push.apply(postFlushCbs, cb) } else { - queue.push(cb) + postFlushCbs.push(cb) } } const dedupe = (cbs: Function[]): Function[] => Array.from(new Set(cbs)) export function flushPostFlushCbs() { - if (reversePostFlushCbs.length) { - const cbs = dedupe(reversePostFlushCbs) - reversePostFlushCbs.length = 0 - let i = cbs.length - while (i--) { - cbs[i]() - } - } if (postFlushCbs.length) { const cbs = dedupe(postFlushCbs) postFlushCbs.length = 0