From c1b92153c9bc30ddf043e207ec322ac7efa547d1 Mon Sep 17 00:00:00 2001
From: lidlanca <8693091+lidlanca@users.noreply.github.com>
Date: Wed, 15 Dec 2021 22:15:31 +0000
Subject: [PATCH] fix(runtime-core): named ref in v-for  fix(#5116)

---
 .../__tests__/rendererTemplateRef.spec.ts     | 57 ++++++++++++++++++-
 .../runtime-core/src/rendererTemplateRef.ts   |  3 +
 2 files changed, 59 insertions(+), 1 deletion(-)

diff --git a/packages/runtime-core/__tests__/rendererTemplateRef.spec.ts b/packages/runtime-core/__tests__/rendererTemplateRef.spec.ts
index 198687c06db..2b95494478e 100644
--- a/packages/runtime-core/__tests__/rendererTemplateRef.spec.ts
+++ b/packages/runtime-core/__tests__/rendererTemplateRef.spec.ts
@@ -7,7 +7,7 @@ import {
   defineComponent,
   reactive,
   serializeInner,
-  shallowRef
+  shallowRef,
 } from '@vue/runtime-test'
 
 // reference: https://vue-composition-api-rfc.netlify.com/api.html#template-refs
@@ -442,4 +442,59 @@ describe('api: template refs', () => {
     await nextTick()
     expect(mapRefs()).toMatchObject(['2', '3', '4'])
   })
+
+   
+
+  test('named ref in v-for', async () => {
+    const show = ref(true)
+    const list = reactive([1, 2, 3])
+    const listRefs = ref([])
+    const mapRefs = () => listRefs.value.map(n => serializeInner(n))
+
+    const App = {
+      setup() {
+        return { listRefs }
+      },
+      render() {
+        return show.value
+          ? h(
+              'ul',
+              list.map(i =>
+                h(
+                  'li',
+                  {
+                    ref: 'listRefs',
+                    ref_for: true
+                  },
+                  i
+                )
+              )
+            )
+          : null
+      }
+    }
+    const root = nodeOps.createElement('div')
+    render(h(App), root)
+
+    expect(mapRefs()).toMatchObject(['1', '2', '3'])
+
+    list.push(4)
+    await nextTick()
+    expect(mapRefs()).toMatchObject(['1', '2', '3', '4'])
+
+    list.shift()
+    await nextTick()
+    expect(mapRefs()).toMatchObject(['2', '3', '4'])
+
+    show.value = !show.value
+    await nextTick()
+
+    expect(mapRefs()).toMatchObject([])
+
+    show.value = !show.value
+    await nextTick()
+    expect(mapRefs()).toMatchObject(['2', '3', '4'])
+  })
+
+
 })
diff --git a/packages/runtime-core/src/rendererTemplateRef.ts b/packages/runtime-core/src/rendererTemplateRef.ts
index 249fb9e55e9..740624c917e 100644
--- a/packages/runtime-core/src/rendererTemplateRef.ts
+++ b/packages/runtime-core/src/rendererTemplateRef.ts
@@ -91,6 +91,9 @@ export function setRef(
             if (!isArray(existing)) {
               if (_isString) {
                 refs[ref] = [refValue]
+                if (hasOwn(setupState, ref)) {
+                  setupState[ref] = refs[ref]
+                }
               } else {
                 ref.value = [refValue]
                 if (rawRef.k) refs[rawRef.k] = ref.value