createRef() — vue Function Reference

Architecture documentation for the createRef() function in ref.ts from the vue codebase.

Function typescript CompilerSFC StyleProcessor calls 1 called by 2

Entity Profile

CompilerSFC→ StyleProcessor→ createRef() — vue Function Reference

Dependency Diagram

graph TD
  06c84f9a_d154_8c3b_e30e_4588287f8747["createRef()"]
  ada43310_8d32_ee2a_f18b_1e24fd4f8a1d["ref.ts"]
  06c84f9a_d154_8c3b_e30e_4588287f8747 -->|defined in| ada43310_8d32_ee2a_f18b_1e24fd4f8a1d
  f464c056_db5f_223e_fc01_2677db93e2f0["ref()"]
  f464c056_db5f_223e_fc01_2677db93e2f0 -->|calls| 06c84f9a_d154_8c3b_e30e_4588287f8747
  85b09d73_5262_0d47_695a_c407f729487d["shallowRef()"]
  85b09d73_5262_0d47_695a_c407f729487d -->|calls| 06c84f9a_d154_8c3b_e30e_4588287f8747
  64ef09a1_8484_35c7_6154_30d045c3ca15["isRef()"]
  06c84f9a_d154_8c3b_e30e_4588287f8747 -->|calls| 64ef09a1_8484_35c7_6154_30d045c3ca15
  style 06c84f9a_d154_8c3b_e30e_4588287f8747 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

src/v3/reactivity/ref.ts lines 62–75

function createRef(rawValue: unknown, shallow: boolean) {
  if (isRef(rawValue)) {
    return rawValue
  }
  const ref: any = {}
  def(ref, RefFlag, true)
  def(ref, ReactiveFlags.IS_SHALLOW, shallow)
  def(
    ref,
    'dep',
    defineReactive(ref, 'value', rawValue, null, shallow, isServerRendering())
  )
  return ref
}