vue3 unref介绍

Vue 3 中的 unref 是一个函数，它用于获取响应式对象的非响应式原始值。通常情况下，当我们使用 Vue 的响应式数据时，访问该数据会自动追踪依赖并建立响应式关系。但有时我们需要直接访问该数据的原始值，而不希望触发对该数据的依赖追踪。

unref 可以用于解除对响应式对象的引用，返回该对象的非响应式原始值。如果传入的值不是响应式对象，则 unref 会直接返回该值。

这在一些场景下非常有用，比如在 setup 函数中，可以使用 unref 来获取 props 或 reactive 对象的原始值，而无需创建额外的响应式依赖。

以下是 unref 的使用示例：

import { ref, reactive, unref } from 'vue';

const prop = ref(5);
const obj = reactive({ value: 10 });

console.log(unref(prop)); // 5
console.log(unref(obj).value); // 10

需要注意的是，unref 只会解除一层响应式引用。如果你想要获取更深层次的非响应式原始值，可以结合其他方法来实现，比如使用 toRaw 函数将 reactive 对象转换为普通对象。