getStyle() — vue Function Reference

Architecture documentation for the getStyle() function in style.ts from the vue codebase.

Function typescript WebPlatform WebRuntime calls 2 called by 2

Entity Profile

WebPlatform→ WebRuntime→ getStyle() — vue Function Reference

Dependency Diagram

graph TD
  34f243e9_d5d7_0297_3d5d_12821a44d0fd["getStyle()"]
  2b67a07e_643c_d534_f8f0_2b694e3a63a5["renderStyle()"]
  2b67a07e_643c_d534_f8f0_2b694e3a63a5 -->|calls| 34f243e9_d5d7_0297_3d5d_12821a44d0fd
  f4b573c3_a3cb_6a57_b5c1_058edeb470d4["updateStyle()"]
  f4b573c3_a3cb_6a57_b5c1_058edeb470d4 -->|calls| 34f243e9_d5d7_0297_3d5d_12821a44d0fd
  25a6997b_f523_6db2_b908_5bc93c78b9d1["normalizeStyleData()"]
  34f243e9_d5d7_0297_3d5d_12821a44d0fd -->|calls| 25a6997b_f523_6db2_b908_5bc93c78b9d1
  7a0093e3_a58a_af71_971f_488b65897e74["extend()"]
  34f243e9_d5d7_0297_3d5d_12821a44d0fd -->|calls| 7a0093e3_a58a_af71_971f_488b65897e74
  style 34f243e9_d5d7_0297_3d5d_12821a44d0fd fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

src/platforms/web/util/style.ts lines 41–71

export function getStyle(vnode: VNodeWithData, checkChild: boolean): Object {
  const res = {}
  let styleData

  if (checkChild) {
    let childNode: VNodeWithData | VNode = vnode
    while (childNode.componentInstance) {
      childNode = childNode.componentInstance._vnode!
      if (
        childNode &&
        childNode.data &&
        (styleData = normalizeStyleData(childNode.data))
      ) {
        extend(res, styleData)
      }
    }
  }

  if ((styleData = normalizeStyleData(vnode.data))) {
    extend(res, styleData)
  }

  let parentNode: VNodeWithData | VNode | undefined = vnode
  // @ts-expect-error parentNode.parent not VNodeWithData
  while ((parentNode = parentNode.parent)) {
    if (parentNode.data && (styleData = normalizeStyleData(parentNode.data))) {
      extend(res, styleData)
    }
  }
  return res
}