diff --git a/packages/runtime-core/__tests__/rendererTemplateRef.spec.ts b/packages/runtime-core/__tests__/rendererTemplateRef.spec.ts index 799108dca8a..a3f2c0d4388 100644 --- a/packages/runtime-core/__tests__/rendererTemplateRef.spec.ts +++ b/packages/runtime-core/__tests__/rendererTemplateRef.spec.ts @@ -217,6 +217,7 @@ describe('api: template refs', () => { } render(h(Comp), root) expect(state.refKey).toBe(root.children[0]) + expect('refKey is not a ref').toHaveBeenWarned() }) test('multiple root refs', () => { diff --git a/packages/runtime-core/src/rendererTemplateRef.ts b/packages/runtime-core/src/rendererTemplateRef.ts index 1ffe3035794..33b04c83a87 100644 --- a/packages/runtime-core/src/rendererTemplateRef.ts +++ b/packages/runtime-core/src/rendererTemplateRef.ts @@ -69,8 +69,16 @@ export function setRef( setupState === EMPTY_OBJ ? () => false : (key: string) => { - if (__DEV__ && knownTemplateRefs.has(rawSetupState[key] as any)) { - return false + if (__DEV__) { + if (hasOwn(rawSetupState, key) && !isRef(rawSetupState[key])) { + warn( + `${key} is not a ref. use a ref to hold the element reference is recommended.`, + ) + } + + if (knownTemplateRefs.has(rawSetupState[key] as any)) { + return false + } } return hasOwn(rawSetupState, key) }