Vue version

3.2.47

Link to minimal reproduction

https://play.vuejs.org/#eNp9UdtKxDAQ/ZUhL6vQNroKQqiyivgTxoe6mdW4zYVcVqX035227lJXEUIyM2dmzuGkY7feV7uMTLA6roP26UZa/PAuJFC4aXKboJMWQDWpOTmdYoCAKQe7zwASxnRPHQIeO9BKwPlZQfO0UcDiwblFX8AELGfAXRMW/dO0ox8euujU/KCEkoTGt01CygDq3MKu3LhwLZkmBLQ9cEsGYouf30illWTjDE21GkTAzR8QQEe6huIoCvpRB43wVk+MPLcU1PyggxVMm8Gg0jS+eovOknmjE7R+BKJkYu+NZOTukEv2mpKPgvNs/falWjvDV4TxkG3SBkvlzOqiWlaXV1zpmOb1CqMpn4N7jxiIUbJitpxTcYehDGgVBgz/kh31/iA8wn6R7n+I9V8Ad7uv

Steps to reproduce

None. You can observe the issue going away when the ID's in testData are converted to a string.

What is expected?

I would expect Vue to either convert the value it receives to a string if necessary, or throw a more useful error message.

What is actually happening?

Error: "Missing ref owner context. ref cannot be used on hoisted vnodes. A vnode with ref must be created inside the render function."

System Info

No response

Any additional comments?

I ran into this weird and very specific issue the other day. Basically it involves using the Options API and iterating through an array of objects using v-for, and using one of the object properties as a dynamic ref. When this property is not a string but a number, there's a pretty cryptic error message that took me a lot of trial and error to figure out.