genProps() — vue Function Reference

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

Function typescript CompilerSFC StyleProcessor calls 1 called by 2

Entity Profile

CompilerSFC→ StyleProcessor→ genProps() — vue Function Reference

Dependency Diagram

graph TD
  11c959b5_53f2_f6ca_bb39_c51ca6580caf["genProps()"]
  54260741_ae9d_a025_86de_47c513f5f82d["index.ts"]
  11c959b5_53f2_f6ca_bb39_c51ca6580caf -->|defined in| 54260741_ae9d_a025_86de_47c513f5f82d
  02d2d2c1_c21e_ae8c_6eba_1f4c093c8eb4["genData()"]
  02d2d2c1_c21e_ae8c_6eba_1f4c093c8eb4 -->|calls| 11c959b5_53f2_f6ca_bb39_c51ca6580caf
  fbca07e6_aa9c_0443_703f_c46ecf6696fa["genSlot()"]
  fbca07e6_aa9c_0443_703f_c46ecf6696fa -->|calls| 11c959b5_53f2_f6ca_bb39_c51ca6580caf
  9c12f1ea_b9e3_b0db_0012_fc867b4ebf43["transformSpecialNewlines()"]
  11c959b5_53f2_f6ca_bb39_c51ca6580caf -->|calls| 9c12f1ea_b9e3_b0db_0012_fc867b4ebf43
  style 11c959b5_53f2_f6ca_bb39_c51ca6580caf fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

src/compiler/codegen/index.ts lines 645–663

function genProps(props: Array<ASTAttr>): string {
  let staticProps = ``
  let dynamicProps = ``
  for (let i = 0; i < props.length; i++) {
    const prop = props[i]
    const value = transformSpecialNewlines(prop.value)
    if (prop.dynamic) {
      dynamicProps += `${prop.name},${value},`
    } else {
      staticProps += `"${prop.name}":${value},`
    }
  }
  staticProps = `{${staticProps.slice(0, -1)}}`
  if (dynamicProps) {
    return `_d(${staticProps},[${dynamicProps.slice(0, -1)}])`
  } else {
    return staticProps
  }
}