genFor() — vue Function Reference

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

Function typescript VueCore GlobalAPI called by 2

Entity Profile

VueCore→ GlobalAPI→ genFor() — vue Function Reference

Dependency Diagram

graph TD
  f1257d59_66c7_6288_39e7_c860744c0fdf["genFor()"]
  6a18399e_553e_fef8_6a39_746f79f94bd2["index.ts"]
  f1257d59_66c7_6288_39e7_c860744c0fdf -->|defined in| 6a18399e_553e_fef8_6a39_746f79f94bd2
  009d7fc7_09cb_184e_e93c_1f468ff505c0["genElement()"]
  009d7fc7_09cb_184e_e93c_1f468ff505c0 -->|calls| f1257d59_66c7_6288_39e7_c860744c0fdf
  db876b7b_004a_9015_7afa_993985df7520["genScopedSlot()"]
  db876b7b_004a_9015_7afa_993985df7520 -->|calls| f1257d59_66c7_6288_39e7_c860744c0fdf
  style f1257d59_66c7_6288_39e7_c860744c0fdf fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

src/compiler/codegen/index.ts lines 241–275

export function genFor(
  el: any,
  state: CodegenState,
  altGen?: Function,
  altHelper?: string
): string {
  const exp = el.for
  const alias = el.alias
  const iterator1 = el.iterator1 ? `,${el.iterator1}` : ''
  const iterator2 = el.iterator2 ? `,${el.iterator2}` : ''

  if (
    __DEV__ &&
    state.maybeComponent(el) &&
    el.tag !== 'slot' &&
    el.tag !== 'template' &&
    !el.key
  ) {
    state.warn(
      `<${el.tag} v-for="${alias} in ${exp}">: component lists rendered with ` +
        `v-for should have explicit keys. ` +
        `See https://v2.vuejs.org/v2/guide/list.html#key for more info.`,
      el.rawAttrsMap['v-for'],
      true /* tip */
    )
  }

  el.forProcessed = true // avoid recursion
  return (
    `${altHelper || '_l'}((${exp}),` +
    `function(${alias}${iterator1}${iterator2}){` +
    `return ${(altGen || genElement)(el, state)}` +
    '})'
  )
}