Skip to content
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

template ref with reactive in v-for always empty in production mode #10655

Open
Filin3 opened this issue Apr 7, 2024 · 3 comments
Open

template ref with reactive in v-for always empty in production mode #10655

Filin3 opened this issue Apr 7, 2024 · 3 comments
Labels
🍰 p2-nice-to-have Priority 2: this is not breaking anything but nice to have it addressed.

Comments

@Filin3
Copy link

Filin3 commented Apr 7, 2024

Vue version

3.4.21

Link to minimal reproduction

https://play.vuejs.org/#eNp9kF9LwzAUxb/KJS/rYLZOfRrdQGUPCv5BfTMipb2t2dokJGmtlH53b1pW9yCjFMK5v5ycezp2rXXY1MhWLHZY6TJxuOESIM5EA81ZrsyaMwFCwvKcM1jt8ccLnA0UcRoM5iRpkroOBPR9HOnRIyITOsXRkbX/YpsaoR1YdLVHRaWVcdCBkg+qlg6zBbkmqRMNQg+5URXMKOWMy1RJ60DDegKC94+5N53uBsEc1hvofASPqxLDUhWBJqynP47G5zdswZwlIhdFuLNKUgnDJc5SVWlRonnSTpADZ6vRzs+SslTf94PmTI2Lg55+Ybr/R9/Z1mucPRu0aBrkbJq5xBToxvH29RFbOk/DSmV1SfSJ4QvSdrXPOGI3tcwo9hE3pL0b+hWyeLPb1qG0h6V8UE/2A88ZdXx7YvW/uJfh1XCPGqUWPxs03pMKpEF4sWT9Ly2kxOo=

Steps to reproduce

Open vue playground then open devtools console and change prod\dev mode

What is expected?

The same behavior is expected in prod and dev mode. Reactive const will be filled in both cases

What is actually happening?

The Reactive constant is filled in dev mode, but always empty in prod

System Info

No response

Any additional comments?

No response

@LinusBorg
Copy link
Member

The production behaviour is correct as the template ref gets a new array reassigned - and const variables are not re-assignable.

However we should look into how to warn about this in dev mode

@LinusBorg LinusBorg added the 🍰 p2-nice-to-have Priority 2: this is not breaking anything but nice to have it addressed. label Apr 7, 2024
@quiteeasy
Copy link
Contributor

quiteeasy commented Apr 23, 2024

In the prod mode, reactive values are not exposed in the setupResult object as the script setup gets inlined when using the script setup syntax. However, this does not occur in development mode or when using the regular setup() function that returns reactive values.

To address this, I have added a warning in the PR for this specific case. One potential solution could be to forbid the use of reactive as a ref completely. However, this approach might have implications for existing code and developer workflows, so it's essential to gather feedback from the team and carefully evaluate the trade-offs.

I'm looking forward to the team's input and suggestions on how to best resolve this issue. In the meantime, I am opening a PR proposing a potential solution, which I'm happy to discuss further with the team.

@quiteeasy
Copy link
Contributor

PR to add a warning for this case #10784

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
🍰 p2-nice-to-have Priority 2: this is not breaking anything but nice to have it addressed.
Projects
None yet
Development

No branches or pull requests

3 participants