Vue version

v3.5.13

Link to minimal reproduction

https://play.vuejs.org/#eNqtU0Fu2zAQ/ArBix0ktVu1J1dpmwY5tIe2SHPkxZHWDmOKJMil60DQ37sUJVkOjCQIciNnZ3dmB2TNL6ydbQPwBc994aRF5gGD/SK0rKxxyGoWPNxAZdUS4RpWrGErZyo2oa7J5xHNPaoJLXRhtEdWmKDxAzuPlOn7kwM4G8F9ARRUoNHHlkPx6QTBI/Enw5Se3A+iQj5Pq9ASdMGunW6M5aXctgfGLqP8gtV1769pUiG/dR0lrqtAr/Gu5Q2+vs4SeqQlCrDtu5Vx54JP5QmTupsvOFts4IFgKXjH7vjkm+BuNSqSlqTZ+Xzv9uC8V7sNiEYzfLBAE9KNhL4VShYbQpL06SkNvShLhuZRoPk89aRwBo1RTEeiyl4eVfaaqLJnoxrGv31Y2TgsUjuaUD4fvSp+xtHTY1zJ9ezeG01/qY7kOLCyUoH7bVHSYxWcskleBF8qZf79bDF0Ac56vLiDYnMEv/e7iAn+x4EHtwXBhxou3Rowla/+/oIdnYdiZcqgiP1E8Rq8USF6TLTvQZdke8Rr3f5ov7rU6xt/tUPQvl8qGo3MpuULTt//8onV93Y/zj61fUI3vPkPXK57Vg==

Steps to reproduce

• Click on Add to useTemplateRef repeatedly and watch how the length of elements inside the component ref is desynced from the real count.
• Now click on Add to ref and watch how the length of elements inside the component ref is same as the real count.

What is expected?

Current documentation suggests that useTemplateRef is a drop-in replacement for the original component ref syntax (const refname = ref()). Therefore their behaviors should be identical and useTemplateRef should return a Ref.

What is actually happening?

useTemplateRef returns a ShallowRef. This breaks reactivity when using a component ref on a looped element inside a v-for (in comparison to using the original component ref syntax const refname = ref())

System Info

Any additional comments?

Would suggest adding useTemplateShallowRef as a variant of useTemplateRef, which would then use the ShallowRef.