Vue version

3.2.33

Link to minimal reproduction

https://codesandbox.io/s/can-push-splice-computed-array-reproduce-oi73jq?file=/src/App.vue

Steps to reproduce

I am able to use splice to remove element and push to add more element to the computed array without specifying any setter to it. I don't think this is the correct behavior of computed (without setter).

const list = ref([1, 2, 3, 4]);
// Or list of objects, both give the same effect: const list = ref([{ value: 1 }, { value: 2 }]);

const listComputed = computed(() => list.value);

listComputed.value = [] // Error (which is the correct behavior)

const removeItem = (index) => {
  listComputed.value.splice(index, 1);
};

const addItem = () => {
  listComputed.value.push(Math.random());
};

What is expected?

Computed array shouldn't change

What is actually happening?

Can use push or splice on computed array to change the value (even the referenced variable is changed)

System Info

No response

Any additional comments?

No response

You are free to qrap thr return value of the computed in readonly(). By default, they are muatable.

@LinusBorg thank you for the fast reply, but should this be specified in the docs? I find it shows the error when I use the assign operator (=) in Typescript, which is very noticeable and correct But for splice and push, it just works, for me thanks to your reply i know that i should wrap it in readonly() or simply avoid splice and push in my code following this mindset https://vuejs.org/guide/essentials/computed.html#avoid-mutating-computed-value, just asking for the others, thanks