Home / Function/ genData() — vue Function Reference

genData() — vue Function Reference

Architecture documentation for the genData() function in index.ts from the vue codebase.

Entity Profile

Dependency Diagram

graph TD
  02d2d2c1_c21e_ae8c_6eba_1f4c093c8eb4["genData()"]
  54260741_ae9d_a025_86de_47c513f5f82d["index.ts"]
  02d2d2c1_c21e_ae8c_6eba_1f4c093c8eb4 -->|defined in| 54260741_ae9d_a025_86de_47c513f5f82d
  075d1f95_9965_89f4_3c01_f944fee6b553["genElement()"]
  075d1f95_9965_89f4_3c01_f944fee6b553 -->|calls| 02d2d2c1_c21e_ae8c_6eba_1f4c093c8eb4
  51a51b9c_5d7a_4e96_c7de_f686070e1977["genComponent()"]
  51a51b9c_5d7a_4e96_c7de_f686070e1977 -->|calls| 02d2d2c1_c21e_ae8c_6eba_1f4c093c8eb4
  181934c9_9a45_2859_dd07_ed21641c2ba4["genDirectives()"]
  02d2d2c1_c21e_ae8c_6eba_1f4c093c8eb4 -->|calls| 181934c9_9a45_2859_dd07_ed21641c2ba4
  11c959b5_53f2_f6ca_bb39_c51ca6580caf["genProps()"]
  02d2d2c1_c21e_ae8c_6eba_1f4c093c8eb4 -->|calls| 11c959b5_53f2_f6ca_bb39_c51ca6580caf
  95a7c3ac_04ed_a46b_41ce_c4ccc31c107e["genHandlers()"]
  02d2d2c1_c21e_ae8c_6eba_1f4c093c8eb4 -->|calls| 95a7c3ac_04ed_a46b_41ce_c4ccc31c107e
  118a5b53_0e80_5668_cad0_a973c510ef35["genScopedSlots()"]
  02d2d2c1_c21e_ae8c_6eba_1f4c093c8eb4 -->|calls| 118a5b53_0e80_5668_cad0_a973c510ef35
  d790e900_9759_b6e2_0563_04ddf5d962a4["genInlineTemplate()"]
  02d2d2c1_c21e_ae8c_6eba_1f4c093c8eb4 -->|calls| d790e900_9759_b6e2_0563_04ddf5d962a4
  style 02d2d2c1_c21e_ae8c_6eba_1f4c093c8eb4 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

src/compiler/codegen/index.ts lines 277–359

export function genData(el: ASTElement, state: CodegenState): string {
  let data = '{'

  // directives first.
  // directives may mutate the el's other properties before they are generated.
  const dirs = genDirectives(el, state)
  if (dirs) data += dirs + ','

  // key
  if (el.key) {
    data += `key:${el.key},`
  }
  // ref
  if (el.ref) {
    data += `ref:${el.ref},`
  }
  if (el.refInFor) {
    data += `refInFor:true,`
  }
  // pre
  if (el.pre) {
    data += `pre:true,`
  }
  // record original tag name for components using "is" attribute
  if (el.component) {
    data += `tag:"${el.tag}",`
  }
  // module data generation functions
  for (let i = 0; i < state.dataGenFns.length; i++) {
    data += state.dataGenFns[i](el)
  }
  // attributes
  if (el.attrs) {
    data += `attrs:${genProps(el.attrs)},`
  }
  // DOM props
  if (el.props) {
    data += `domProps:${genProps(el.props)},`
  }
  // event handlers
  if (el.events) {
    data += `${genHandlers(el.events, false)},`
  }
  if (el.nativeEvents) {
    data += `${genHandlers(el.nativeEvents, true)},`
  }
  // slot target
  // only for non-scoped slots
  if (el.slotTarget && !el.slotScope) {
    data += `slot:${el.slotTarget},`
  }
  // scoped slots
  if (el.scopedSlots) {
    data += `${genScopedSlots(el, el.scopedSlots, state)},`
  }
  // component v-model
  if (el.model) {
    data += `model:{value:${el.model.value},callback:${el.model.callback},expression:${el.model.expression}},`
  }
  // inline-template
  if (el.inlineTemplate) {
    const inlineTemplate = genInlineTemplate(el, state)
    if (inlineTemplate) {
      data += `${inlineTemplate},`
    }
  }
  data = data.replace(/,$/, '') + '}'
  // v-bind dynamic argument wrap
  // v-bind with dynamic arguments must be applied using the same v-bind object
  // merge helper so that class/style/mustUseProp attrs are handled correctly.
  if (el.dynamicAttrs) {
    data = `_b(${data},"${el.tag}",${genProps(el.dynamicAttrs)})`
  }
  // v-bind data wrap
  if (el.wrapData) {
    data = el.wrapData(data)
  }
  // v-on data wrap
  if (el.wrapListeners) {
    data = el.wrapListeners(data)
  }

Domain

Subdomains

Frequently Asked Questions

What does genData() do?
genData() is a function in the vue codebase, defined in src/compiler/codegen/index.ts.
Where is genData() defined?
genData() is defined in src/compiler/codegen/index.ts at line 277.
What does genData() call?
genData() calls 5 function(s): genDirectives, genHandlers, genInlineTemplate, genProps, genScopedSlots.
What calls genData()?
genData() is called by 2 function(s): genComponent, genElement.

Analyze Your Own Codebase

Get architecture documentation, dependency graphs, and domain analysis for your codebase in minutes.

Try Supermodel Free