shallowReadonly() 浅い読み取り専用プロキシ
最終更新：2026-10-22
shallowReadonly() 浅い読み取り専用プロキシ
shallowReadonly() は第一階層のプロパティだけを読み取り専用にします。ネストされたオブジェクトは変更可能なままです。
| グループ | リアクティビティ: 応用 |
|---|---|
| 種類 | API |
| スコープ | コンポーネント内 |
| Vue バージョン | 3.0+ |
| SSR 対応 | 対応 |
📝 構文
const cfg = shallowReadonly({ theme: 'dark', nested: {} })
cfg.theme = 'light' // ❌ ブロックされる
cfg.nested.x = 1 // ✅ 許可される（ネストは読み取り専用ではない）⚙️ 引数
| target | オブジェクト |
|---|
戻り値：浅い読み取り専用プロキシ
▶ 例
以下のコードを編集して結果を確認しましょう：
出力：
The top-level write is blocked with a warning; the nested write goes through.💡 ポイント
⚠️ 注意 浅い読み取り専用は安全対策ではありません。ネストしたデータは書き換え可能なので、データ保護には使わないでください。
ℹ️ 補足 使われる場面は少数です。第一階層は定数、ネストした参照は可変（キャッシュコンテナなど）というケース向けです。
🏷️ 関連応用
💡 関連ケース
関連ケースは近日公開予定。
📚 関連チュートリアル
❓ よくある質問
Q readonly との違いは？
A 1 階層だけをロックします。ネストしたオブジェクトは読み書き可能なままですが、readonly は全階層を再帰的にロックします。
Q よくある使用場面は？
A まれです。主に、性能を気にしつつ浅い防御が必要な内部 API で使われます。
Q 検出できますか？
A isReadonly も isProxy も true を返します。
