useTemplateRef returns ShallowRef instead of Ref

[HafisCZ]

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.

[absidue]

The documentation already tells you that it returns a shallowRef, so I'm not sure why documented behaviour would be unexpected. Additionally changing the return type would be a breaking change.

Returns a shallow ref [...]

https://vuejs.org/api/composition-api-helpers.html#usetemplateref

[HafisCZ]

The documentation already tells you that it returns a shallowRef, so I'm not sure why documented behaviour would be unexpected. Additionally changing the return type would be a breaking change.

Returns a shallow ref [...]

https://vuejs.org/api/composition-api-helpers.html#usetemplateref

In the link you sent yes, however in the more detailed page https://vuejs.org/guide/essentials/template-refs.html it does not 🙂 However if you look at the Refs inside v-for section it does quite heavily imply you can use it instead of the old ref