Browse Source

fix(runtime-vapor): add move function for block repositioning with transition support

daiwei 4 months ago
parent
commit
9dba82daef

+ 24 - 0
packages/runtime-vapor/src/block.ts

@@ -158,6 +158,30 @@ export function remove(block: Block, parent?: ParentNode): void {
   }
   }
 }
 }
 
 
+export function move(block: Block, parent: ParentNode): void {
+  if (block instanceof Node) {
+    if ((block as TransitionBlock).$transition && block instanceof Element) {
+      performTransitionLeave(
+        block,
+        (block as TransitionBlock).$transition as TransitionHooks,
+        () => insert(block, parent),
+      )
+    } else {
+      insert(block, parent)
+    }
+  } else if (isVaporComponent(block)) {
+    move(block.block, parent)
+  } else if (isArray(block)) {
+    for (let i = 0; i < block.length; i++) {
+      move(block[i], parent)
+    }
+  } else {
+    // fragment
+    move(block.nodes, parent)
+    if (block.anchor) move(block.anchor, parent)
+  }
+}
+
 /**
 /**
  * dev / test only
  * dev / test only
  */
  */

+ 2 - 2
packages/runtime-vapor/src/components/KeepAlive.ts

@@ -18,7 +18,7 @@ import {
   warn,
   warn,
   watch,
   watch,
 } from '@vue/runtime-dom'
 } from '@vue/runtime-dom'
-import { type Block, insert, remove } from '../block'
+import { type Block, insert, move, remove } from '../block'
 import {
 import {
   type ObjectVaporComponent,
   type ObjectVaporComponent,
   type VaporComponent,
   type VaporComponent,
@@ -358,7 +358,7 @@ export function deactivate(
   instance: VaporComponentInstance,
   instance: VaporComponentInstance,
   container: ParentNode,
   container: ParentNode,
 ): void {
 ): void {
-  insert(instance.block, container)
+  move(instance.block, container)
 
 
   queuePostFlushCb(() => {
   queuePostFlushCb(() => {
     if (instance.da) invokeArrayFns(instance.da)
     if (instance.da) invokeArrayFns(instance.da)