diff --git a/packages/runtime-core/__tests__/rendererTemplateRef.spec.ts b/packages/runtime-core/__tests__/rendererTemplateRef.spec.ts index a7ae7a06b..b1a519e3d 100644 --- a/packages/runtime-core/__tests__/rendererTemplateRef.spec.ts +++ b/packages/runtime-core/__tests__/rendererTemplateRef.spec.ts @@ -179,6 +179,37 @@ describe('api: template refs', () => { expect(el.value).toBe(null) }) + it('render function ref unmount with conditional update', async () => { + const root1 = nodeOps.createElement('div') + const root2 = nodeOps.createElement('div') + const el1 = ref(null) + const el2 = ref(null) + const toggle = ref(true) + + const Comp1 = { + setup() { + return () => (toggle.value ? h('div', { ref: el1 }) : h('div')) + }, + } + + const Comp2 = { + setup() { + return () => h('div', { ref: toggle.value ? el2 : undefined }) + }, + } + + render(h(Comp1), root1) + render(h(Comp2), root2) + + expect(el1.value).toBe(root1.children[0]) + expect(el2.value).toBe(root2.children[0]) + + toggle.value = false + await nextTick() + expect(el1.value).toBe(null) + expect(el2.value).toBe(null) + }) + test('string ref inside slots', async () => { const root = nodeOps.createElement('div') const spy = vi.fn() diff --git a/packages/runtime-core/src/renderer.ts b/packages/runtime-core/src/renderer.ts index 022571050..fa698a7c0 100644 --- a/packages/runtime-core/src/renderer.ts +++ b/packages/runtime-core/src/renderer.ts @@ -484,6 +484,8 @@ function baseCreateRenderer( // set ref if (ref != null && parentComponent) { setRef(ref, n1 && n1.ref, parentSuspense, n2 || n1, !n2) + } else if (ref == null && n1 && n1.ref != null) { + setRef(n1.ref, null, parentSuspense, n1, true) } }