Home / Function/ updateStyle() — vue Function Reference

updateStyle() — vue Function Reference

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

Function typescript WebPlatform WebRuntime calls 6

Entity Profile

Dependency Diagram

graph TD
  f4b573c3_a3cb_6a57_b5c1_058edeb470d4["updateStyle()"]
  a1f5b8ca_b6d5_6b24_155e_038685c97c85["isUndef()"]
  f4b573c3_a3cb_6a57_b5c1_058edeb470d4 -->|calls| a1f5b8ca_b6d5_6b24_155e_038685c97c85
  9f352e13_edc9_9711_6747_1f057e9ed07f["normalizeStyleBinding()"]
  f4b573c3_a3cb_6a57_b5c1_058edeb470d4 -->|calls| 9f352e13_edc9_9711_6747_1f057e9ed07f
  2be3818d_a4f3_495c_543c_ee071b428982["isDef()"]
  f4b573c3_a3cb_6a57_b5c1_058edeb470d4 -->|calls| 2be3818d_a4f3_495c_543c_ee071b428982
  7a0093e3_a58a_af71_971f_488b65897e74["extend()"]
  f4b573c3_a3cb_6a57_b5c1_058edeb470d4 -->|calls| 7a0093e3_a58a_af71_971f_488b65897e74
  34f243e9_d5d7_0297_3d5d_12821a44d0fd["getStyle()"]
  f4b573c3_a3cb_6a57_b5c1_058edeb470d4 -->|calls| 34f243e9_d5d7_0297_3d5d_12821a44d0fd
  2bc00625_4c85_43e2_d223_5de834ee1789["setProp()"]
  f4b573c3_a3cb_6a57_b5c1_058edeb470d4 -->|calls| 2bc00625_4c85_43e2_d223_5de834ee1789
  style f4b573c3_a3cb_6a57_b5c1_058edeb470d4 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

src/platforms/web/runtime/modules/style.ts lines 57–97

function updateStyle(oldVnode: VNodeWithData, vnode: VNodeWithData) {
  const data = vnode.data
  const oldData = oldVnode.data

  if (
    isUndef(data.staticStyle) &&
    isUndef(data.style) &&
    isUndef(oldData.staticStyle) &&
    isUndef(oldData.style)
  ) {
    return
  }

  let cur, name
  const el: any = vnode.elm
  const oldStaticStyle: any = oldData.staticStyle
  const oldStyleBinding: any = oldData.normalizedStyle || oldData.style || {}

  // if static style exists, stylebinding already merged into it when doing normalizeStyleData
  const oldStyle = oldStaticStyle || oldStyleBinding

  const style = normalizeStyleBinding(vnode.data.style) || {}

  // store normalized style under a different key for next diff
  // make sure to clone it if it's reactive, since the user likely wants
  // to mutate it.
  vnode.data.normalizedStyle = isDef(style.__ob__) ? extend({}, style) : style

  const newStyle = getStyle(vnode, true)

  for (name in oldStyle) {
    if (isUndef(newStyle[name])) {
      setProp(el, name, '')
    }
  }
  for (name in newStyle) {
    cur = newStyle[name]
    // ie9 setting to null has no effect, must use empty string
    setProp(el, name, cur == null ? '' : cur)
  }
}

Domain

Subdomains

Calls

Source

Frequently Asked Questions

What does updateStyle() do?
updateStyle() is a function in the vue codebase.
What does updateStyle() call?
updateStyle() calls 6 function(s): extend, getStyle, isDef, isUndef, normalizeStyleBinding, setProp.

Analyze Your Own Codebase

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

Try Supermodel Free