New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Refs inside v-for doesn't apply through v-bind #10696
Comments
Refs in v-for involve a bit of compile-time work. That can'r happen when the compiler can't see the ref prop in the template. I'd say we need to document this, at least I dont see a realistic way to "fix" it - but someone else might have an idea? |
The compiler has some optimizations related to refs handling, so moving that logic to runtime to support dynamic ref bindings would be a bad idea. I agree with @LinusBorg that documenting the current behavior would be the better approach. |
So why do ref handling work correctly in |
The current behavior works because the ref is resolved at runtime from the object. However, the identifier that the ref is inside a v-for is set at compile time. Due to this, the ref is often set to a random element in the list, typically the last one. We could set the identifier that a ref is inside a v-for without having the ref props explicitly set, but that would require adding an extra prop to every element inside the v-for that has I'm opening a PR for the team to consider this potential solution. Let me know if you have any other thoughts or suggestions. |
Vue version
3.4.21
Link to minimal reproduction
https://stackblitz.com/edit/vitejs-vite-auhpmh?file=src%2FApp.vue
Steps to reproduce
App.vue
ref="itemRefs"
tov-bind="props"
in the 23 lineWhat is expected?
itemRefs
should have an array of the elementsWhat is actually happening?
itemRefs
have only the last elementSystem Info
Any additional comments?
No response
The text was updated successfully, but these errors were encountered: