A separate type for the setter in Ref<T, S> can lead to nested refs

[mefcorvi]

Vue version

3.4.35

Link to minimal reproduction

https://play.vuejs.org/#eNqNkU1LwzAYx7/KQy7bYLRMPc1uoDJBDyrqMZeue9ZlpknISy2UfneftNvcQYaHQPJ/Ib8nadmdMUkdkM1Z5gorjAeHPhiQuSoXnHnH2ZIrURltPbRgcQsdbK2uYES1EVdcFVo5D2tYRHcc12wyuR10LTGRuhyvkzqXAROvH0WDmzEFIE1hxtXBObSv/lm0QXlRIaC12nKVpQM8odLBY2Vk7pFOANlutmxbwuu6LKV9DJ8F2JRmpAu3okz2Tit6iDbWOCt0ZYRE+2q8ICDO5tA70cul1N/PveZtwOlRL3ZYfP2h710TNc7eLDq0NXJ28nxuS/SDvfp4wYb2J7PSmyApfcF8R3qsEBmH2H1QG8I+y/W0T/0XClV+ulXjUbnjUBE0Jrs+zxl968OF0X9xr5ObvsdVx7ofTv/Bfw==

Steps to reproduce

const b = ref(ref(1));
console.log(b.value.toFixed()); // 1
b.value = ref(2);
console.log(b.value.toFixed()); // runtime error

What is expected?

Either:

• it should not be possible to put one ref into another;
• b.value returns 2 instead of the ref(2).

What is actually happening?

Here, the type of b is Ref<number, number | Ref<number>>. This means that we can set it to Ref<number> and get a number, but if we set b.value to ref(1), we actually get ref(1) back, which is not a number.

Any additional comments?

Caused by #11442 as a fix of #6766.
As an option, to adjust logic with the current types, we may return the value of the nested ref in the _value getter of the RefImpl class.

[Alfred-Skyblue]

The issue is that b.value = ref(2) leads to b._value = ref(2). When we trigger the setter, we do not unref b._value, so this results in b.value still returning a ref(2). This has been fixed in #11537.

const a = ref(1)
const b = ref(a);
// b === a
console.log(b.value.toFixed()); // 1
const c = ref(1)
const d = ref(0)
d.value = c
// d !== c
console.log(d.value); // c = ref(1)

Alternatively, we can also prohibit setting the value of a ref, as suggested in #11536.