applyTranslation() — vue Function Reference

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

Function typescript WebPlatform RuntimeModules

Entity Profile

WebPlatform→ RuntimeModules→ applyTranslation() — vue Function Reference

Dependency Diagram

graph TD
  eb85636b_ff80_629a_99f4_164229a8092c["applyTranslation()"]
  7c91c607_f320_9fb6_0e00_4e5d50689bec["transition-group.ts"]
  eb85636b_ff80_629a_99f4_164229a8092c -->|defined in| 7c91c607_f320_9fb6_0e00_4e5d50689bec
  style eb85636b_ff80_629a_99f4_164229a8092c 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'
  }
}