isref用于精准判断值是否为ref实例并返回布尔值,unref则安全解包ref取.value或原样返回普通值;二者常配合实现“先识别后取值”的健壮逻辑。

isRef 和 unref 是 Vue 3 组合式 API 中处理响应式数据类型的两个基础工具函数,它们不创建响应式,也不改变原数据,而是帮你安全识别和读取值——尤其当你不确定传入的是 ref 还是普通值时。
isRef:先判断,再决定怎么用
它只做一件事:返回一个布尔值,告诉你某个值是不是 ref 实例(包括 ref、shallowRef、computed 等具有 __v_isRef: true 标识的对象)。
- 对
ref(123)返回true - 对
123、{ a: 1 }、reactive({})都返回false - 常用于分支逻辑,比如函数内部需要根据类型走不同路径
unref:一键取值,不用管它是不是 ref
它像一个“智能取值器”:如果是 ref,就自动取 .value;如果不是,就原样返回。不修改、不解构、不新建响应式对象。
unref(ref('hello')) → 'hello'unref('hello') → 'hello'unref(computed(() => count.value * 2)) → 当前计算结果- 注意:它对
reactive对象无效——unref(reactive({}))就是原对象本身,不会递归解包
为什么这两个函数经常一起用?
单独用 unref 足够简单场景;但需要做类型适配或条件逻辑时,isRef 提供了更明确的控制权。
- 比如写一个通用默认值函数:
useDefault(source, fallback),需判断source是否为 ref 来决定是否用computed包裹 - 又比如从 props 解构后想保留响应性,但又不确定用户传的是
ref还是原始值,先isRef判断,再决定是否unref或监听
别混淆:它们不是用来“脱离响应式”的
有人误以为 unref 能把响应式对象变成普通对象——其实不能。它只是读值,不切断响应链。真正要拿到非响应式的原始副本,得用 toRaw 或 structuredClone。
-
unref(ref({ x: 1 })) → { x: 1 },但这个对象仍是响应式对象的.value,修改它可能影响源数据 -
toRaw(ref({ x: 1 })) → { x: 1 },得到的是原始对象快照,与响应式系统完全断开
大量免费API接口:立即使用
涵盖生活服务API、金融科技API、企业工商API、等相关的API接口服务。免费API接口可安全、合规地连接上下游,为数据API应用能力赋能!











