genComponentModel() — vue Function Reference

Architecture documentation for the genComponentModel() function in model.ts from the vue codebase.

Function typescript VueCore Instance calls 1

Entity Profile

VueCore→ Instance→ genComponentModel() — vue Function Reference

Dependency Diagram

graph TD
  e50a073d_038c_045c_620f_b64d27f686d0["genComponentModel()"]
  1f566fbb_35e7_982c_1234_287d1ad7f72c["model.ts"]
  e50a073d_038c_045c_620f_b64d27f686d0 -->|defined in| 1f566fbb_35e7_982c_1234_287d1ad7f72c
  bf9ddf1c_ef97_a050_8f03_7e20fe6e8f1c["genAssignmentCode()"]
  e50a073d_038c_045c_620f_b64d27f686d0 -->|calls| bf9ddf1c_ef97_a050_8f03_7e20fe6e8f1c
  style e50a073d_038c_045c_620f_b64d27f686d0 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

src/compiler/directives/model.ts lines 6–31

export function genComponentModel(
  el: ASTElement,
  value: string,
  modifiers: ASTModifiers | null
): void {
  const { number, trim } = modifiers || {}

  const baseValueExpression = '$$v'
  let valueExpression = baseValueExpression
  if (trim) {
    valueExpression =
      `(typeof ${baseValueExpression} === 'string'` +
      `? ${baseValueExpression}.trim()` +
      `: ${baseValueExpression})`
  }
  if (number) {
    valueExpression = `_n(${valueExpression})`
  }
  const assignment = genAssignmentCode(value, valueExpression)

  el.model = {
    value: `(${value})`,
    expression: JSON.stringify(value),
    callback: `function (${baseValueExpression}) {${assignment}}`
  }
}