From: daiwei <daiwei521@126.com>
Date: Fri, 19 Dec 2025 03:43:59 +0000 (+0800)
Subject: fix(runtime-vapor): optimize prop handling in VaporTransitionGroup using Proxy
X-Git-Tag: v3.6.0-beta.1~17
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=0ceebebf58c8f7ea686e96c79763f8b01672ddfd;p=thirdparty%2Fvuejs%2Fcore.git

fix(runtime-vapor): optimize prop handling in VaporTransitionGroup using Proxy
---

diff --git a/packages/runtime-vapor/src/components/TransitionGroup.ts b/packages/runtime-vapor/src/components/TransitionGroup.ts
index 76d5acd1c..7055b6123 100644
--- a/packages/runtime-vapor/src/components/TransitionGroup.ts
+++ b/packages/runtime-vapor/src/components/TransitionGroup.ts
@@ -21,6 +21,7 @@ import {
   type VaporTransitionHooks,
   insert,
 } from '../block'
+import { renderEffect } from '../renderEffect'
 import {
   resolveTransitionHooks,
   setTransitionHooks,
@@ -55,7 +56,18 @@ export const VaporTransitionGroup: ObjectVaporComponent = decorate({
   setup(props: TransitionGroupProps, { slots }) {
     const instance = currentInstance as VaporComponentInstance
     const state = useTransitionState()
-    const cssTransitionProps = resolveTransitionProps(props)
+
+    // use proxy to keep props reference stable
+    let cssTransitionProps = resolveTransitionProps(props)
+    const propsProxy = new Proxy({} as typeof cssTransitionProps, {
+      get(_, key) {
+        return cssTransitionProps[key as keyof typeof cssTransitionProps]
+      },
+    })
+
+    renderEffect(() => {
+      cssTransitionProps = resolveTransitionProps(props)
+    })
 
     let prevChildren: TransitionBlock[]
     let children: TransitionBlock[]
@@ -121,7 +133,7 @@ export const VaporTransitionGroup: ObjectVaporComponent = decorate({
 
     // store props and state on fragment for reusing during insert new items
     setTransitionHooksOnFragment(slottedBlock, {
-      props: cssTransitionProps,
+      props: propsProxy,
       state,
       instance,
     } as VaporTransitionHooks)
@@ -133,7 +145,7 @@ export const VaporTransitionGroup: ObjectVaporComponent = decorate({
         if (child.$key != null) {
           const hooks = resolveTransitionHooks(
             child,
-            cssTransitionProps,
+            propsProxy,
             state,
             instance!,
           )