fix(Transition): skip transition if el is hidden by v-show

diff --git a/packages/runtime-core/src/renderer.ts b/packages/runtime-core/src/renderer.ts
index 89b8be6a18047d1080f66128d3afe46e6d2a5e20..1d408e9868fa1f6673990d7627bce76927302a92 100644 (file)
--- a/packages/runtime-core/src/renderer.ts
+++ b/packages/runtime-core/src/renderer.ts
@@ -2054,7 +2054,9 @@ function baseCreateRenderer(
     const needTransition =
       moveType !== MoveType.REORDER &&
       shapeFlag & ShapeFlags.ELEMENT &&
-      transition
+      transition &&
+      // #14031 skip transition hooks if el is hidden by v-show
+      !isHiddenByVShow(vnode)
     if (needTransition) {
       if (moveType === MoveType.ENTER) {
         transition!.beforeEnter(el!)
@@ -2565,3 +2567,9 @@ export function invalidateMount(hooks: LifecycleHook): void {
       hooks[i].flags! |= SchedulerJobFlags.DISPOSED
   }
 }
+
+function isHiddenByVShow(vnode: VNode): boolean {
+  // @ts-expect-error vShow has this internal name
+  const vShowDir = vnode.dirs && vnode.dirs.find(dir => dir.name === 'show')
+  return !!(vShowDir && !vShowDir.value)
+}