I created a simple program to test out shallowRef and encountered an unexpected behavior.
The instructions mention that the first method of updating should work, but only the second one seems to update the value properly. Why is that?
Below is my code snippet:
<script setup>
import { shallowRef } from 'vue';
let value = 0;
const shallowState = shallowRef({count: value});
</script>
To demonstrate the issue, here is the template section with two buttons:
<template>
<button @click="shallowState.value = {count: ++value}">shallowRef {{ shallowState.count }}</button>
<br /><br />
<button @click="shallowState = {count: ++value}">shallowRef {{ shallowState.count }}</button>
</template>