addHandler() — vue Function Reference

Architecture documentation for the addHandler() function in helpers.ts from the vue codebase.

Function typescript TemplateCompiler CodeGen calls 2 called by 5

Entity Profile

TemplateCompiler→ CodeGen→ addHandler() — vue Function Reference

Dependency Diagram

graph TD
  5f7b1ed1_7106_20e8_83d2_d329e3f4a814["addHandler()"]
  6f72c0fc_c9ca_496b_1bc7_d93b516eda63["processAttrs()"]
  6f72c0fc_c9ca_496b_1bc7_d93b516eda63 -->|calls| 5f7b1ed1_7106_20e8_83d2_d329e3f4a814
  7539ecb1_c1db_6b0e_5a90_bbe9d998a079["genCheckboxModel()"]
  7539ecb1_c1db_6b0e_5a90_bbe9d998a079 -->|calls| 5f7b1ed1_7106_20e8_83d2_d329e3f4a814
  dc49a23f_3673_17c2_d4ff_83744ff5f5a2["genRadioModel()"]
  dc49a23f_3673_17c2_d4ff_83744ff5f5a2 -->|calls| 5f7b1ed1_7106_20e8_83d2_d329e3f4a814
  31784304_125e_2f0a_0d77_c4b3ad8fa829["genSelect()"]
  31784304_125e_2f0a_0d77_c4b3ad8fa829 -->|calls| 5f7b1ed1_7106_20e8_83d2_d329e3f4a814
  7a357d2a_ca6b_0c68_87b1_045695805af9["genDefaultModel()"]
  7a357d2a_ca6b_0c68_87b1_045695805af9 -->|calls| 5f7b1ed1_7106_20e8_83d2_d329e3f4a814
  75006c32_86de_dcdf_41ba_a8061b4acb18["prependModifierMarker()"]
  5f7b1ed1_7106_20e8_83d2_d329e3f4a814 -->|calls| 75006c32_86de_dcdf_41ba_a8061b4acb18
  96030d9b_6fc5_c5dd_8879_245007a0e6b2["rangeSetItem()"]
  5f7b1ed1_7106_20e8_83d2_d329e3f4a814 -->|calls| 96030d9b_6fc5_c5dd_8879_245007a0e6b2
  style 5f7b1ed1_7106_20e8_83d2_d329e3f4a814 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

src/compiler/helpers.ts lines 92–170

export function addHandler(
  el: ASTElement,
  name: string,
  value: string,
  modifiers?: ASTModifiers | null,
  important?: boolean,
  warn?: Function,
  range?: Range,
  dynamic?: boolean
) {
  modifiers = modifiers || emptyObject
  // warn prevent and passive modifier
  /* istanbul ignore if */
  if (__DEV__ && warn && modifiers.prevent && modifiers.passive) {
    warn(
      "passive and prevent can't be used together. " +
        "Passive handler can't prevent default event.",
      range
    )
  }

  // normalize click.right and click.middle since they don't actually fire
  // this is technically browser-specific, but at least for now browsers are
  // the only target envs that have right/middle clicks.
  if (modifiers.right) {
    if (dynamic) {
      name = `(${name})==='click'?'contextmenu':(${name})`
    } else if (name === 'click') {
      name = 'contextmenu'
      delete modifiers.right
    }
  } else if (modifiers.middle) {
    if (dynamic) {
      name = `(${name})==='click'?'mouseup':(${name})`
    } else if (name === 'click') {
      name = 'mouseup'
    }
  }

  // check capture modifier
  if (modifiers.capture) {
    delete modifiers.capture
    name = prependModifierMarker('!', name, dynamic)
  }
  if (modifiers.once) {
    delete modifiers.once
    name = prependModifierMarker('~', name, dynamic)
  }
  /* istanbul ignore if */
  if (modifiers.passive) {
    delete modifiers.passive
    name = prependModifierMarker('&', name, dynamic)
  }

  let events
  if (modifiers.native) {
    delete modifiers.native
    events = el.nativeEvents || (el.nativeEvents = {})
  } else {
    events = el.events || (el.events = {})
  }

  const newHandler: any = rangeSetItem({ value: value.trim(), dynamic }, range)
  if (modifiers !== emptyObject) {
    newHandler.modifiers = modifiers
  }

  const handlers = events[name]
  /* istanbul ignore if */
  if (Array.isArray(handlers)) {
    important ? handlers.unshift(newHandler) : handlers.push(newHandler)
  } else if (handlers) {
    events[name] = important ? [newHandler, handlers] : [handlers, newHandler]
  } else {
    events[name] = newHandler
  }

  el.plain = false
}