From: daiwei <daiwei521@126.com>
Date: Tue, 21 Jan 2025 02:24:21 +0000 (+0800)
Subject: fix(useTemplateRef): don't update setup ref for useTemplateRef key
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=1dff44693e4707aabb166d388c44a4556e8086c9;p=thirdparty%2Fvuejs%2Fcore.git

fix(useTemplateRef): don't update setup ref for useTemplateRef key
---

diff --git a/packages/runtime-core/src/helpers/useTemplateRef.ts b/packages/runtime-core/src/helpers/useTemplateRef.ts
index 4cb10ea813..025c3e90d8 100644
--- a/packages/runtime-core/src/helpers/useTemplateRef.ts
+++ b/packages/runtime-core/src/helpers/useTemplateRef.ts
@@ -1,5 +1,5 @@
 import { type ShallowRef, readonly, shallowRef } from '@vue/reactivity'
-import { getCurrentInstance } from '../component'
+import { type Data, getCurrentInstance } from '../component'
 import { warn } from '../warning'
 import { EMPTY_OBJ } from '@vue/shared'
 
@@ -12,12 +12,7 @@ export function useTemplateRef<T = unknown, Keys extends string = string>(
   const r = shallowRef(null)
   if (i) {
     const refs = i.refs === EMPTY_OBJ ? (i.refs = {}) : i.refs
-    let desc: PropertyDescriptor | undefined
-    if (
-      __DEV__ &&
-      (desc = Object.getOwnPropertyDescriptor(refs, key)) &&
-      !desc.configurable
-    ) {
+    if (__DEV__ && isUseTemplateRefKey(refs, key)) {
       warn(`useTemplateRef('${key}') already exists.`)
     } else {
       Object.defineProperty(refs, key, {
@@ -38,3 +33,16 @@ export function useTemplateRef<T = unknown, Keys extends string = string>(
   }
   return ret
 }
+
+export function isUseTemplateRefKey(refs: Data, key: string): boolean {
+  let desc: PropertyDescriptor | undefined
+  if (
+    __DEV__ &&
+    (desc = Object.getOwnPropertyDescriptor(refs, key)) &&
+    !desc.configurable
+  ) {
+    return true
+  }
+
+  return false
+}
diff --git a/packages/runtime-core/src/rendererTemplateRef.ts b/packages/runtime-core/src/rendererTemplateRef.ts
index ca21030dc3..664cea6e68 100644
--- a/packages/runtime-core/src/rendererTemplateRef.ts
+++ b/packages/runtime-core/src/rendererTemplateRef.ts
@@ -16,7 +16,10 @@ import { ErrorCodes, callWithErrorHandling } from './errorHandling'
 import type { SchedulerJob } from './scheduler'
 import { queuePostRenderEffect } from './renderer'
 import { type ComponentOptions, getComponentPublicInstance } from './component'
-import { knownTemplateRefs } from './helpers/useTemplateRef'
+import {
+  isUseTemplateRefKey,
+  knownTemplateRefs,
+} from './helpers/useTemplateRef'
 
 /**
  * Function for handling a template ref
@@ -91,6 +94,12 @@ export function setRef(
               return false
             }
           }
+
+          // skip setting up ref if the key is from useTemplateRef
+          if (isUseTemplateRefKey(refs, key)) {
+            return false
+          }
+
           return hasOwn(rawSetupState, key)
         }