applyTranslation() — vue Function Reference

Architecture documentation for the applyTranslation() function in transition-group.ts from the vue codebase.

Function typescript WebPlatform WebRuntime

Entity Profile

WebPlatform→ WebRuntime→ applyTranslation() — vue Function Reference

Dependency Diagram

graph TD
  4a6a6464_1170_4dec_740c_e511ec2cb8f4["applyTranslation()"]
  f7026368_bf6f_2dd0_00ce_f887a9165898["transition-group.ts"]
  4a6a6464_1170_4dec_740c_e511ec2cb8f4 -->|defined in| f7026368_bf6f_2dd0_00ce_f887a9165898
  style 4a6a6464_1170_4dec_740c_e511ec2cb8f4 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

src/platforms/web/runtime/components/transition-group.ts lines 193–204

function applyTranslation(c: VNodeWithData) {
  const oldPos = c.data.pos
  const newPos = c.data.newPos
  const dx = oldPos.left - newPos.left
  const dy = oldPos.top - newPos.top
  if (dx || dy) {
    c.data.moved = true
    const s = c.elm.style
    s.transform = s.WebkitTransform = `translate(${dx}px,${dy}px)`
    s.transitionDuration = '0s'
  }
}