Skip to content

Commit

Permalink
feat: add origin prop for <transition-group>, fix vuejs#8424
Browse files Browse the repository at this point in the history
  • Loading branch information
Justineo committed Feb 5, 2019
1 parent ee9b684 commit 5206363
Showing 1 changed file with 25 additions and 7 deletions.
32 changes: 25 additions & 7 deletions src/platforms/web/runtime/components/transition-group.js
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,14 @@ import {

const props = extend({
tag: String,
moveClass: String
moveClass: String,
origin: {
type: String,
default: 'viewport',
validator (val) {
return ['viewport', 'document'].indexOf(val) !== -1
}
}
}, transitionProps)

delete props.mode
Expand Down Expand Up @@ -80,7 +87,7 @@ export default {
for (let i = 0; i < prevChildren.length; i++) {
const c: VNode = prevChildren[i]
c.data.transition = transitionData
c.data.pos = c.elm.getBoundingClientRect()
c.data.pos = this.getPosition(c)
if (map[c.key]) {
kept.push(c)
} else {
Expand All @@ -104,7 +111,7 @@ export default {
// we divide the work into three loops to avoid mixing DOM reads and writes
// in each iteration - which helps prevent layout thrashing.
children.forEach(callPendingCbs)
children.forEach(recordPosition)
children.forEach(this.recordPosition)
children.forEach(applyTranslation)

// force reflow to put everything in position
Expand Down Expand Up @@ -157,6 +164,21 @@ export default {
const info: Object = getTransitionInfo(clone)
this.$el.removeChild(clone)
return (this._hasMove = info.hasTransform)
},
getPosition (c: VNode) {
const relativePos = c.elm.getBoundingClientRect()
const origin = this.origin
if (origin === 'document' && document.documentElement) {
const originPos = document.documentElement.getBoundingClientRect()
return {
top: relativePos.top - originPos.top,
left: relativePos.left - originPos.left
}
}
return relativePos
},
recordPosition (c: VNode) {
c.data.newPos = this.getPosition(c)
}
}
}
Expand All @@ -172,10 +194,6 @@ function callPendingCbs (c: VNode) {
}
}

function recordPosition (c: VNode) {
c.data.newPos = c.elm.getBoundingClientRect()
}

function applyTranslation (c: VNode) {
const oldPos = c.data.pos
const newPos = c.data.newPos
Expand Down

0 comments on commit 5206363

Please sign in to comment.