toRaw() 取回原始对象
最后更新:2026-10-22
toRaw() 取回原始对象
toRaw() 返回代理背后的原始对象:需要绕过响应式追踪、或把数据交给外部库时使用。
| 分组 | 响应式·进阶 |
|---|---|
| 类型 | API |
| 作用域 | 组件内 |
| Vue 版本 | 3.0+ |
| SSR 支持 | 支持 |
📝 语法
const raw = toRaw(proxy)
raw.count = 5 // 改动不触发更新(脱离追踪)
⚙️ 参数
| proxy | reactive/readonly 代理或 ref |
|---|
返回值:原始对象(未代理)
▶ 示例
修改下面的代码,在预览区实时查看效果:
输出:
显示「与原对象相同:true」。
💡 要点
ℹ️ 说明 典型用途:把数据传给第三方库(图表、地图)避免代理干扰,或做对象身份比较。
⚠️ 注意 改原始对象不触发视图更新——不要用它绕过响应式做“静默修改”,会造成视图与数据不一致。
🏷️ 相关进阶
💡 相关案例
更多案例即将上线。
📚 相关教程
❓ 常见问题
Q 为什么第三方库需要它?
A 部分库用对象身份或内部结构判断状态,代理会导致异常行为或额外开销。
Q 对 ref 使用返回什么?
A 返回 ref 内部的原始值(若内部是对象则为其原对象)。
Q 能替代 markRaw 吗?
A 不能:toRaw 是取出,markRaw 是标记后永不代理。