createReadonly() — vue Function Reference

Architecture documentation for the createReadonly() function in readonly.ts from the vue codebase.

Function typescript VueCore GlobalAPI calls 5 called by 2

Entity Profile

VueCore→ GlobalAPI→ createReadonly() — vue Function Reference

Dependency Diagram

graph TD
  654a6eae_ac65_7684_a219_7d7993c2aac4["createReadonly()"]
  8420591a_8fdc_59a9_134d_e2c52487724c["readonly.ts"]
  654a6eae_ac65_7684_a219_7d7993c2aac4 -->|defined in| 8420591a_8fdc_59a9_134d_e2c52487724c
  a5c1c2cc_1bd9_a30d_1ec0_fcb3ad3e90cf["readonly()"]
  a5c1c2cc_1bd9_a30d_1ec0_fcb3ad3e90cf -->|calls| 654a6eae_ac65_7684_a219_7d7993c2aac4
  e7c8478d_de00_8c17_e9fd_05b5703f8f65["shallowReadonly()"]
  e7c8478d_de00_8c17_e9fd_05b5703f8f65 -->|calls| 654a6eae_ac65_7684_a219_7d7993c2aac4
  24d1b598_7844_eabd_7bf3_b06754c98fbb["isCollectionType()"]
  654a6eae_ac65_7684_a219_7d7993c2aac4 -->|calls| 24d1b598_7844_eabd_7bf3_b06754c98fbb
  f4212d06_3802_22f2_e5de_b57826dd5a8e["isReadonly()"]
  654a6eae_ac65_7684_a219_7d7993c2aac4 -->|calls| f4212d06_3802_22f2_e5de_b57826dd5a8e
  f264de96_ce30_ab7e_6f2f_bd7a1a19804f["isRef()"]
  654a6eae_ac65_7684_a219_7d7993c2aac4 -->|calls| f264de96_ce30_ab7e_6f2f_bd7a1a19804f
  9c37c7df_b33a_f5b7_931d_e335ff41ce94["isShallow()"]
  654a6eae_ac65_7684_a219_7d7993c2aac4 -->|calls| 9c37c7df_b33a_f5b7_931d_e335ff41ce94
  ad2f42ad_9bf1_770f_7f96_d8954e41b1a7["defineReadonlyProperty()"]
  654a6eae_ac65_7684_a219_7d7993c2aac4 -->|calls| ad2f42ad_9bf1_770f_7f96_d8954e41b1a7
  style 654a6eae_ac65_7684_a219_7d7993c2aac4 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

src/v3/reactivity/readonly.ts lines 44–97

function createReadonly(target: any, shallow: boolean) {
  if (!isPlainObject(target)) {
    if (__DEV__) {
      if (isArray(target)) {
        warn(`Vue 2 does not support readonly arrays.`)
      } else if (isCollectionType(target)) {
        warn(
          `Vue 2 does not support readonly collection types such as Map or Set.`
        )
      } else {
        warn(`value cannot be made readonly: ${typeof target}`)
      }
    }
    return target as any
  }

  if (__DEV__ && !Object.isExtensible(target)) {
    warn(
      `Vue 2 does not support creating readonly proxy for non-extensible object.`
    )
  }

  // already a readonly object
  if (isReadonly(target)) {
    return target as any
  }

  // already has a readonly proxy
  const existingFlag = shallow ? rawToShallowReadonlyFlag : rawToReadonlyFlag
  const existingProxy = target[existingFlag]
  if (existingProxy) {
    return existingProxy
  }

  const proxy = Object.create(Object.getPrototypeOf(target))
  def(target, existingFlag, proxy)

  def(proxy, ReactiveFlags.IS_READONLY, true)
  def(proxy, ReactiveFlags.RAW, target)

  if (isRef(target)) {
    def(proxy, RefFlag, true)
  }
  if (shallow || isShallow(target)) {
    def(proxy, ReactiveFlags.IS_SHALLOW, true)
  }

  const keys = Object.keys(target)
  for (let i = 0; i < keys.length; i++) {
    defineReadonlyProperty(proxy, target, keys[i], shallow)
  }

  return proxy as any
}