Skip to content

Commit 08b1ca3

Browse files
yyx990803yyx990803
committed
revert transition handling
1 parent 2dedd4e commit 08b1ca3

File tree

9 files changed

+35
-55
lines changed

9 files changed

+35
-55
lines changed

‎src/compiler/compile.js‎

Lines changed: 11 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -576,7 +576,7 @@ function compileDirectives (attrs, options) {
576576
}
577577
} else
578578

579-
// speical case for el
579+
// special case for el
580580
if (name === 'el' || name === 'bind-el') {
581581
dirs.push({
582582
name: 'el',
@@ -586,6 +586,16 @@ function compileDirectives (attrs, options) {
586586
})
587587
} else
588588

589+
// special case for transition
590+
if (name === 'transition' || name === 'bind-transition') {
591+
dirs.push({
592+
name: 'transition',
593+
arg: bindRE.test(name),
594+
descriptors: [newDirParser.parse(value)],
595+
def: options.directives.transition
596+
})
597+
}
598+
589599
// attribute bindings
590600
if (bindRE.test(name)) {
591601
var attributeName = name.replace(bindRE, '')

‎src/deprecations.js‎

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -83,11 +83,7 @@ if (process.env.NODE_ENV !== 'production') {
8383
V_TRANSITION: function () {
8484
warn(
8585
'v-transition will no longer be a directive in 1.0.0; It will become a ' +
86-
'special attribute without the prefix. Use "transition" instead. Also, ' +
87-
'it will no longer attach the .v-transition class, but instead leave ' +
88-
'the transition attribute on the element. If you were using the ' +
89-
'".name-transition" CSS selector before, you should now use the ' +
90-
'"[transition="name"]" selector instead.' +
86+
'special attribute without the prefix. Use "transition" instead.' +
9187
newBindingSyntaxLink
9288
)
9389
},

‎src/directives/for.js‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
var _ = require('../util')
22
var config = require('../config')
3-
var transition = require('../transition')
43
var FragmentFactory = require('../fragment/factory')
54
var isObject = _.isObject
65
var uid = 0
@@ -451,7 +450,7 @@ module.exports = {
451450

452451
getStagger: function (frag, index, total, type) {
453452
type = type + 'Stagger'
454-
var trans = transition.get(frag.node, this.vm)
453+
var trans = frag.node.__v_trans
455454
var hooks = trans && trans.hooks
456455
var hook = hooks && (hooks[type] || hooks.stagger)
457456
return hook

‎src/directives/repeat.js‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,6 @@ var _ = require('../util')
22
var config = require('../config')
33
var isObject = _.isObject
44
var isPlainObject = _.isPlainObject
5-
var transition = require('../transition')
65
var textParser = require('../parsers/text')
76
var expParser = require('../parsers/expression')
87
var templateParser = require('../parsers/template')
@@ -649,7 +648,7 @@ module.exports = {
649648

650649
getStagger: function (vm, index, total, type) {
651650
type = type + 'Stagger'
652-
var trans = transition.get(vm.$el, vm)
651+
var trans = vm.$el.__v_trans
653652
var hooks = trans && trans.hooks
654653
var hook = hooks && (hooks[type] || hooks.stagger)
655654
return hook

‎src/directives/transition.js‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,8 +9,10 @@ module.exports = {
99
isLiteral: true,
1010

1111
bind: function () {
12-
if (!this._isDynamicLiteral) {
12+
if (!this._isDynamicLiteral && !this.arg) {
1313
this.update(this.expression)
14+
} else if (this.arg) {
15+
this._isDynamicLiteral = true
1416
}
1517
},
1618

‎src/transition/index.js‎

Lines changed: 1 addition & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
var _ = require('../util')
2-
var Transition = require('./transition')
32

43
/**
54
* Append with transition.
@@ -74,7 +73,7 @@ exports.removeThenAppend = function (el, target, vm, cb) {
7473
*/
7574

7675
var apply = exports.apply = function (el, direction, op, vm, cb) {
77-
var transition = exports.get(el, vm)
76+
var transition = el.__v_trans
7877
if (
7978
!transition ||
8079
// skip if there are no js hooks and CSS transition is
@@ -94,28 +93,3 @@ var apply = exports.apply = function (el, direction, op, vm, cb) {
9493
var action = direction > 0 ? 'enter' : 'leave'
9594
transition[action](op, cb)
9695
}
97-
98-
/**
99-
* Get the transition object from an element, will create
100-
* one if it has the "transition" attribute but doesn't have
101-
* a transition object, or if the current transition object's
102-
* id doesn't match the desired id.
103-
*
104-
* @param {Element} el
105-
* @param {Vue} vm
106-
* @return {Transition|undefined}
107-
*/
108-
109-
exports.get = function (el, vm) {
110-
var transition = el.__v_trans
111-
var id = el.getAttribute && el.getAttribute('transition')
112-
// create new transition object if
113-
// 1. element has "transition" attribute
114-
// 2. current transition object's id doesn't match
115-
if (id != null && (!transition || transition.id !== id)) {
116-
var hooks = _.resolveAsset(vm.$options, 'transitions', id)
117-
id = id || 'v'
118-
transition = el.__v_trans = new Transition(el, id, hooks, el.__vue__ || vm)
119-
}
120-
return transition
121-
}

‎test/unit/specs/directives/for/for_spec.js‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -609,9 +609,9 @@ if (_.inBrowser) {
609609
vm.items.splice(1, 1, {a: 4})
610610
setTimeout(function () {
611611
expect(el.innerHTML).toBe(
612-
'<div transition="test">1</div>' +
613-
'<div transition="test">4</div>' +
614-
'<div transition="test">3</div>'
612+
'<div class="test-transition">1</div>' +
613+
'<div class="test-transition">4</div>' +
614+
'<div class="test-transition">3</div>'
615615
)
616616
document.body.removeChild(el)
617617
done()

‎test/unit/specs/directives/for/for_stagger_spec.js‎

Lines changed: 13 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -82,12 +82,12 @@ describe('v-for staggering transitions', function () {
8282
expect(el.innerHTML).toBe('')
8383
_.nextTick(function () {
8484
expect(el.children.length).toBe(1)
85-
expect(el.children[0].className).toBe('stagger-enter')
85+
expect(el.children[0].className).toBe('stagger-transition stagger-enter')
8686
expect(el.children[0].textContent).toBe('1')
8787
vm.list = [vm.list[0]] // remove second
8888
setTimeout(function () {
8989
// should have only one
90-
expect(el.innerHTML).toBe('<div transition="stagger">1</div>')
90+
expect(el.innerHTML).toBe('<div class="stagger-transition">1</div>')
9191
done()
9292
}, delayAmount * multiplier)
9393
})
@@ -115,15 +115,15 @@ describe('v-for staggering transitions', function () {
115115
expect(el.innerHTML).toBe('')
116116
_.nextTick(function () {
117117
expect(el.children.length).toBe(1)
118-
expect(el.children[0].className).toBe('stagger-enter')
118+
expect(el.children[0].className).toBe('stagger-transition stagger-enter')
119119
expect(el.children[0].textContent).toBe('1')
120120
vm.list = [vm.list[2], vm.list[1], vm.list[0]] // reorder
121121
setTimeout(function () {
122122
// should have correct order
123123
expect(el.innerHTML).toBe(
124-
'<div transition="stagger">3</div>' +
125-
'<div transition="stagger">2</div>' +
126-
'<div transition="stagger">1</div>'
124+
'<div class="stagger-transition">3</div>' +
125+
'<div class="stagger-transition">2</div>' +
126+
'<div class="stagger-transition">1</div>'
127127
)
128128
done()
129129
}, delayAmount * 3)
@@ -135,24 +135,24 @@ describe('v-for staggering transitions', function () {
135135
expect(el.innerHTML).toBe('')
136136
_.nextTick(function () {
137137
expect(el.children.length).toBe(1)
138-
expect(el.children[0].className).toBe('stagger-enter')
138+
expect(el.children[0].className).toBe('stagger-transition stagger-enter')
139139
expect(el.children[0].textContent).toBe('1')
140140
_.nextTick(function () {
141-
expect(el.innerHTML).toBe('<div transition="stagger">1</div>')
141+
expect(el.innerHTML).toBe('<div class="stagger-transition">1</div>')
142142
setTimeout(function () {
143143
expect(el.innerHTML).toBe(
144-
'<div transition="stagger">1</div>' +
145-
'<div transition="stagger">2</div>'
144+
'<div class="stagger-transition">1</div>' +
145+
'<div class="stagger-transition">2</div>'
146146
)
147147
vm.list = []
148148
_.nextTick(function () {
149149
expect(el.children.length).toBe(2)
150-
expect(el.children[0].className).toBe('stagger-leave')
150+
expect(el.children[0].className).toBe('stagger-transition stagger-leave')
151151
expect(el.children[0].textContent).toBe('1')
152-
expect(el.children[1].className).toBe('')
152+
expect(el.children[1].className).toBe('stagger-transition')
153153
expect(el.children[1].textContent).toBe('2')
154154
_.nextTick(function () {
155-
expect(el.innerHTML).toBe('<div transition="stagger">2</div>')
155+
expect(el.innerHTML).toBe('<div class="stagger-transition">2</div>')
156156
setTimeout(function () {
157157
expect(el.innerHTML).toBe('')
158158
done()

‎test/unit/specs/directives/ref_spec.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -89,7 +89,7 @@ if (_.inBrowser) {
8989
})
9090
})
9191
})
92-
92+
9393
// #1147
9494
it('should be able to reference host via ref inside transclusion content', function (done) {
9595
var vm = new Vue({

0 commit comments

Comments
 (0)