Sfoglia il codice sorgente

wip: adjust lifecycle

Evan You 7 anni fa
parent
commit
7a3a5850dc

+ 1 - 0
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 {

+ 12 - 9
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)
           }
         }
       },

+ 2 - 19
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