feat: replace Fragment's effects property and BlockFragment's mounted hook with a new updated hook.

Author: edison1105

packages/runtime-vapor/src/apiCreateFor.ts

@@ -402,7 +402,8 @@ export const createFor = (
     } else {
       oldBlocks = []
     }
-    if (frag.effects) frag.effects.forEach(effect => effect())
+
+    if (frag.updated) frag.updated.forEach(m => m())
     setActiveSub(prevSub)
   }
 

packages/runtime-vapor/src/components/Teleport.ts

@@ -104,11 +104,11 @@ export class TeleportFragment extends VaporFragment {
     // updateCssVars will be called when subtree changed
     if (this.parentComponent && this.parentComponent.ut) {
       if (isFragment(nodes)) {
-        ;(nodes.effects || (nodes.effects = [])).push(() => updateCssVars(this))
+        ;(nodes.updated || (nodes.updated = [])).push(() => updateCssVars(this))
       } else if (isArray(nodes)) {
         nodes.forEach(node => {
           if (isFragment(node)) {
-            ;(node.effects || (node.effects = [])).push(() =>
+            ;(node.updated || (node.updated = [])).push(() =>
               updateCssVars(this),
             )
           }

packages/runtime-vapor/src/fragment.ts

@@ -52,8 +52,8 @@ export class VaporFragment<T extends Block = Block>
     refKey: string | undefined,
   ) => void
 
-  // effects to run after fragment render
-  effects?: (() => void)[]
+  // hooks
+  updated?: ((nodes?: Block) => void)[]
 
   constructor(nodes: T) {
     this.nodes = nodes
@@ -83,7 +83,6 @@ export class DynamicFragment extends VaporFragment {
     scope: EffectScope,
   ) => boolean)[]
   beforeMount?: ((newKey: any, nodes: Block, scope: EffectScope) => void)[]
-  mounted?: ((nodes: Block, scope: EffectScope) => void)[]
 
   constructor(anchorLabel?: string) {
     super([])
@@ -192,15 +191,14 @@ export class DynamicFragment extends VaporFragment {
 
       if (parent) {
         insert(this.nodes, parent, this.anchor)
-        if (this.mounted) {
-          this.mounted.forEach(hook => hook(this.nodes, this.scope!))
+        if (this.updated) {
+          this.updated.forEach(hook => hook(this.nodes))
         }
       }
     } else {
       this.scope = undefined
       this.nodes = []
     }
-    if (this.effects) this.effects.forEach(effect => effect())
   }
 
   hydrate = (isEmpty = false): void => {

packages/runtime-vapor/src/vdomInterop.ts

@@ -383,7 +383,7 @@ function createVDOMComponent(
     }
 
     frag.nodes = vnode.el as any
-    if (frag.effects) frag.effects.forEach(effect => effect())
+    if (frag.updated) frag.updated.forEach(m => m())
   }
 
   frag.remove = unmount
@@ -450,7 +450,7 @@ function renderVDOMSlot(
       }
     }
 
-    if (frag.effects) frag.effects.forEach(effect => effect())
+    if (frag.updated) frag.updated.forEach(m => m())
   }
 
   const render = (parentNode?: ParentNode, anchor?: Node | null) => {