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

Readonly reference to an array is not honored when inside v-for #13087

Open
ahmadshahwan opened this issue Mar 22, 2025 · 1 comment · May be fixed by #13091
Open

Readonly reference to an array is not honored when inside v-for #13087

ahmadshahwan opened this issue Mar 22, 2025 · 1 comment · May be fixed by #13091
Labels
🔨 p3-minor-bug Priority 3: this fixes a bug, but is an edge case that only affects very specific usage. regression

Comments

@ahmadshahwan
Copy link

Vue version

3.5.13

Link to minimal reproduction

https://play.vuejs.org/#eNp9kdFPwjAQxv+VS1+ABIcEfcFBooYHfVCjvlljlu0Gxa1t2m6OLPvfvXYBITG89e779bvv2pbdah3VFbI5i21qhHZg0VV6yaUotTIOWjCYZEoWO+ggN6qEAfGDmxMgP9G45DJV0jpIld7B4uAwJHL40UIzhyl0n6MRuXAZT/rJNJMKh6UuEodUAcSZqKG+yJVZcFaCkMGRs2XbQhk1ZH0JXRdPCOv5zdRLYazvU+n9jzzZmDlL4XKxjrZWSVq89Tc5S1WpRYHmWTtB4TmbQ1C8lhSF+nkMPWcqHO/76QbT73/6W9v4HmcvBi2aGjk7aC4xa3S9vHp7wobOB7FUWVUQfUZ8RauKymfssbtKZhT7iAtpH8LvCLl+t6vGobT7pXxQT3aB54x+7P7M6n9xZ9FVuMdlR6/4VaPxnvSAs+g6ms5Y9wtIl8Jq

Steps to reproduce

Create a readonly reference to a reference of an array of objects.

const copy = readonly(ref([{ x: 1 }]));

In the template, iterate over the reference array using v-for, while attempting to modify the current element, for instance, inside a child component setup function or directly in the template as follows.

<div v-for="m in copy">{{ m.x = 0 }}</div>

What is expected?

Modification should be disallowed as the reference is a readonly one.

What is actually happening?

Modification is permitted. Data is mutated. No error or waring issued.

System Info

System:
    OS: Linux 5.15 Ubuntu 24.04.1 LTS 24.04.1 LTS (Noble Numbat)
    CPU: (22) x64 Intel(R) Core(TM) Ultra 9 185H
    Memory: 10.22 GB / 15.43 GB
    Container: Yes
    Shell: 5.2.21 - /bin/bash
  Binaries:
    Node: 23.10.0 - /usr/local/bin/node
    npm: 10.9.2 - /usr/local/bin/npm

Any additional comments?

This observation only occurs when readonly() is passed a reference. It doesn't happend if the array is passed directly to readonly().

@jh-leong jh-leong added 🔨 p3-minor-bug Priority 3: this fixes a bug, but is an edge case that only affects very specific usage. regression labels Mar 23, 2025
@edison1105
Copy link
Member

a side note: In v3.4, it works as expected, and the console will have warnings.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
🔨 p3-minor-bug Priority 3: this fixes a bug, but is an edge case that only affects very specific usage. regression
Projects
None yet
3 participants