在 Vue 3 中，shallowRef 是一个用于创建浅层响应式引用的函数。它类似于 ref，但与 ref 不同，shallowRef 会对其中的对象进行浅层代理，而不是响应式地进行深层代理。
使用 shallowRef，你可以创建一个可变的响应式对象。当该对象的属性发生变化时，Vue 3 会跟踪并触发相关的更新。
下面是使用 shallowRef 的示例：
javascript
插入代码复制代码
import { shallowRef } from 'vue';
const user = { name: 'Alice', age: 25 };
const userRef = shallowRef(user);
console.log(userRef.value); // 输出：{ name: 'Alice', age: 25 }
userRef.value.name = 'Bob';
console.log(userRef.value); // 输出：{ name: 'Bob', age: 25 }
在上述示例中，我们创建了一个名为 user 的对象，并使用 shallowRef 将其转换为一个浅层响应式引用 userRef，并通过 .value 属性访问和修改其中的值。
shallowRef 只会对对象进行浅层代理，这意味着如果对象的属性值是对象或数组，它们将不会被代理为深层响应式，而是保持为普通的引用。这意味着修改对象的属性值不会触发重新渲染，但修改对象本身的引用会触发重新渲染。
使用 shallowRef 主要是为了在某些情况下避免性能损失，例如当你知道对象的深层属性很少变动，或者不需要深层代理时，使用浅层代理可以提高性能。
详细信息
和 ref() 不同，浅层 ref 的内部值将会原样存储和暴露，并且不会被深层递归地转为响应式。只有对 .value 的访问是响应式的。
shallowRef() 常常用于对大型数据结构的性能优化或是与外部的状态管理系统集成。
