genHandlers() — vue Function Reference

Architecture documentation for the genHandlers() function in events.ts from the vue codebase.

Function typescript VueCore VDom calls 1 called by 1

Entity Profile

VueCore→ VDom→ genHandlers() — vue Function Reference

Dependency Diagram

graph TD
  8ee0ad78_1765_a17a_b19d_4e3acc54fa2c["genHandlers()"]
  53156b1d_131d_a4d4_4575_daa92ec38378["events.ts"]
  8ee0ad78_1765_a17a_b19d_4e3acc54fa2c -->|defined in| 53156b1d_131d_a4d4_4575_daa92ec38378
  2f9548d4_5dab_e18c_c75b_5e2c2bf4a780["genData()"]
  2f9548d4_5dab_e18c_c75b_5e2c2bf4a780 -->|calls| 8ee0ad78_1765_a17a_b19d_4e3acc54fa2c
  0b3b08ce_6026_235f_3970_cabc078630b0["genHandler()"]
  8ee0ad78_1765_a17a_b19d_4e3acc54fa2c -->|calls| 0b3b08ce_6026_235f_3970_cabc078630b0
  style 8ee0ad78_1765_a17a_b19d_4e3acc54fa2c fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

src/compiler/codegen/events.ts lines 56–78

export function genHandlers(
  events: ASTElementHandlers,
  isNative: boolean
): string {
  const prefix = isNative ? 'nativeOn:' : 'on:'
  let staticHandlers = ``
  let dynamicHandlers = ``
  for (const name in events) {
    const handlerCode = genHandler(events[name])
    //@ts-expect-error
    if (events[name] && events[name].dynamic) {
      dynamicHandlers += `${name},${handlerCode},`
    } else {
      staticHandlers += `"${name}":${handlerCode},`
    }
  }
  staticHandlers = `{${staticHandlers.slice(0, -1)}}`
  if (dynamicHandlers) {
    return prefix + `_d(${staticHandlers},[${dynamicHandlers.slice(0, -1)}])`
  } else {
    return prefix + staticHandlers
  }
}