在 Vue 3 中,unref 和 .value 的区别主要体现在处理响应式对象时的作用和场景不同:
.value 的用途
.value 是 ref 对象的属性,用于访问或修改响应式值。当通过 ref() 或 toRef() 创建响应式引用时,需要通过 .value 获取或设置实际值。例如:
const count = ref(1) count.value = 2 // 修改响应式值
unref 的用途
unref 是一个工具函数,用于统一处理 ref 或 reactive 对象:
若传入值为 ref,则返回其 .value
若传入值为普通对象/数值,直接返回原值
例如:
const value = unref(ref(1)) // 返回 1 const obj = reactive({ count: 0 }) unref(obj) // 直接返回 { count: 0 }
主要区别
访问层级
.value 是 ref 对象的内部属性,需通过对象直接访问
unref 是独立函数,可处理任意对象(ref/普通值),返回原始值或 ref 的值
使用场景
当操作已知为 ref 的对象时,直接使用 .value(如模板绑定或组件内部逻辑)
当需要统一处理不确定是否为 ref 的对象时,使用 unref(如函数参数处理或复杂逻辑判断)