genCheckboxModel() — vue Function Reference

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

Function typescript WebPlatform WebCompiler called by 1

Entity Profile

WebPlatform→ WebCompiler→ genCheckboxModel() — vue Function Reference

Dependency Diagram

graph TD
  59fefc37_deab_068e_5567_c9461be61301["genCheckboxModel()"]
  fba67da2_5967_6779_f088_36da3dcbd363["model.ts"]
  59fefc37_deab_068e_5567_c9461be61301 -->|defined in| fba67da2_5967_6779_f088_36da3dcbd363
  604989de_6282_4011_dd2f_f80716675ba4["model()"]
  604989de_6282_4011_dd2f_f80716675ba4 -->|calls| 59fefc37_deab_068e_5567_c9461be61301
  style 59fefc37_deab_068e_5567_c9461be61301 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

src/platforms/web/compiler/directives/model.ts lines 66–105

function genCheckboxModel(
  el: ASTElement,
  value: string,
  modifiers?: ASTModifiers | null
) {
  const number = modifiers && modifiers.number
  const valueBinding = getBindingAttr(el, 'value') || 'null'
  const trueValueBinding = getBindingAttr(el, 'true-value') || 'true'
  const falseValueBinding = getBindingAttr(el, 'false-value') || 'false'
  addProp(
    el,
    'checked',
    `Array.isArray(${value})` +
      `?_i(${value},${valueBinding})>-1` +
      (trueValueBinding === 'true'
        ? `:(${value})`
        : `:_q(${value},${trueValueBinding})`)
  )
  addHandler(
    el,
    'change',
    `var $$a=${value},` +
      '$$el=$event.target,' +
      `$$c=$$el.checked?(${trueValueBinding}):(${falseValueBinding});` +
      'if(Array.isArray($$a)){' +
      `var $$v=${number ? '_n(' + valueBinding + ')' : valueBinding},` +
      '$$i=_i($$a,$$v);' +
      `if($$el.checked){$$i<0&&(${genAssignmentCode(
        value,
        '$$a.concat([$$v])'
      )})}` +
      `else{$$i>-1&&(${genAssignmentCode(
        value,
        '$$a.slice(0,$$i).concat($$a.slice($$i+1))'
      )})}` +
      `}else{${genAssignmentCode(value, '$$c')}}`,
    null,
    true
  )
}