readonly 创建只读响应式代理,递归冻结嵌套属性,修改触发警告但不报错,原对象仍可修改且同步到代理;isproxy 仅识别 vue 响应式 api(reactive/readonly/shallowreactive/shallowreadonly)创建的代理,ref 或手动 proxy 均返回 false。

readonly 用于创建只读的响应式代理,而 isProxy 是用来检测对象是否为 Vue 创建的代理(包括 reactive、readonly、shallowReactive、shallowReadonly 生成的对象)。
readonly 的作用和特点
readonly 把一个普通对象、ref 或 reactive 对象包装成只读代理。它递归地冻结所有嵌套层级——无论对象多深,都不能被修改。尝试赋值会触发警告,但不会抛出错误(开发环境下)。
- 对原始数据无影响:readonly(obj) 返回的新对象不可改,但原 obj 仍可自由修改,且改动会同步到只读代理中
- 不收集依赖:与 reactive 不同,readonly 不执行 track 操作,因此内部属性变化不会触发视图更新(除非该属性本身是 ref 或被其他响应式结构包裹)
- 可嵌套使用:readonly 可以作用于 reactive 对象,也可以作用于另一个 readonly 对象,结果仍是只读代理
isProxy 的判断逻辑
isProxy(value) 返回 true,仅当 value 是由以下任一 API 创建的代理对象:reactive、readonly、shallowReactive、shallowReadonly。
安装并运行 Aperture(Lightning Labs 的 L402 闪电反向代理),用于创建 L402 付费墙、配置付费 API 端点、为其他代理托管付费内容或测试 L402 认证流程。
- ref 创建的对象不是 Proxy,所以 isProxy(ref(1)) === false
- 即使是一个 shallowReadonly 包裹的对象,isProxy 也返回 true
- 手动用 new Proxy 构造的对象,isProxy 也返回 false —— 它只识别 Vue 内部的特定 handler
两者配合使用的典型场景
在组件接收 props 或从 provide/inject 获取数据时,常需确认数据是否已被只读保护,避免意外修改:
- 用 isReadonly 判断是否只读(更精确),或用 isProxy + isReactive 组合判断是否“可写响应式”
- 如果 isProxy(val) 为 true 但 isReadonly(val) 为 false,基本可认为它是 reactive 创建的、可修改的响应式对象
- 若 isProxy(val) 为 true 且 isReadonly(val) 为 true,则不应尝试赋值,尤其在子组件中接收父级传入的 readonly 数据时
注意几个易混淆点
这几个判断函数有明确分工,不能混用:
- isReactive 只认 reactive 和 shallowReactive,readonly 包裹的 reactive 对象会同时满足 isReactive 和 isReadonly
- isProxy 范围最宽,只要是由 Vue 响应式系统创建的代理都算,但它不区分“可写”还是“只读”
- toRaw 可以解包 isProxy 为 true 的对象,拿到原始数据;但对 ref 无效,ref 需用 .value 或 unref
大量免费API接口:立即使用
涵盖生活服务API、金融科技API、企业工商API、等相关的API接口服务。免费API接口可安全、合规地连接上下游,为数据API应用能力赋能!










