Browse Source

improve mergeVNodeHook logic

dev
Evan You 8 years ago
parent
commit
4a74883864
  1. 20
      src/core/vdom/helpers.js
  2. 2
      src/core/vdom/modules/directives.js
  3. 12
      src/platforms/web/runtime/components/transition.js
  4. 2
      src/platforms/web/runtime/modules/transition.js

20
src/core/vdom/helpers.js

@ -65,19 +65,19 @@ export function getFirstComponentChild (children: ?Array<any>) {
return children && children.filter(c => c && c.componentOptions)[0] return children && children.filter(c => c && c.componentOptions)[0]
} }
export function mergeVNodeHook (def: Object, key: string, hook: Function) { export function mergeVNodeHook (def: Object, hookKey: string, hook: Function, key: string) {
const oldHook = def[key] key = key + hookKey
const injectedHash = def.__injected || (def.__injected = {})
if (injectedHash[key]) return
injectedHash[key] = true
const oldHook = def[hookKey]
if (oldHook) { if (oldHook) {
const injectedHash = def.__injected || (def.__injected = {}) def[hookKey] = function () {
if (!injectedHash[key]) { oldHook.apply(this, arguments)
injectedHash[key] = true hook.apply(this, arguments)
def[key] = function () {
oldHook.apply(this, arguments)
hook.apply(this, arguments)
}
} }
} else { } else {
def[key] = hook def[hookKey] = hook
} }
} }

2
src/core/vdom/modules/directives.js

@ -15,7 +15,7 @@ export default {
if (hasInsert) { if (hasInsert) {
mergeVNodeHook(vnode.data.hook || (vnode.data.hook = {}), 'insert', () => { mergeVNodeHook(vnode.data.hook || (vnode.data.hook = {}), 'insert', () => {
applyDirectives(oldVnode, vnode, 'inserted') applyDirectives(oldVnode, vnode, 'inserted')
}) }, 'dir-insert')
} }
}, },
update: function updateDirectives (oldVnode: VNodeWithData, vnode: VNodeWithData) { update: function updateDirectives (oldVnode: VNodeWithData, vnode: VNodeWithData) {

12
src/platforms/web/runtime/components/transition.js

@ -119,7 +119,7 @@ export default {
return placeholder(h, rawChild) return placeholder(h, rawChild)
} }
child.key = child.key == null || child.isStatic const key = child.key = child.key == null || child.isStatic
? `__v${child.tag + this._uid}__` ? `__v${child.tag + this._uid}__`
: child.key : child.key
const data = (child.data || (child.data = {})).transition = extractTransitionData(this) const data = (child.data || (child.data = {})).transition = extractTransitionData(this)
@ -132,7 +132,7 @@ export default {
child.data.show = true child.data.show = true
} }
if (oldChild && oldChild.data && oldChild.key !== child.key) { if (oldChild && oldChild.data && oldChild.key !== key) {
// replace old child transition data with fresh one // replace old child transition data with fresh one
// important for dynamic transitions! // important for dynamic transitions!
const oldData = oldChild.data.transition = extend({}, data) const oldData = oldChild.data.transition = extend({}, data)
@ -144,16 +144,16 @@ export default {
mergeVNodeHook(oldData, 'afterLeave', () => { mergeVNodeHook(oldData, 'afterLeave', () => {
this._leaving = false this._leaving = false
this.$forceUpdate() this.$forceUpdate()
}) }, key)
return placeholder(h, rawChild) return placeholder(h, rawChild)
} else if (mode === 'in-out') { } else if (mode === 'in-out') {
var delayedLeave var delayedLeave
var performLeave = () => { delayedLeave() } var performLeave = () => { delayedLeave() }
mergeVNodeHook(data, 'afterEnter', performLeave) mergeVNodeHook(data, 'afterEnter', performLeave, key)
mergeVNodeHook(data, 'enterCancelled', performLeave) mergeVNodeHook(data, 'enterCancelled', performLeave, key)
mergeVNodeHook(oldData, 'delayLeave', leave => { mergeVNodeHook(oldData, 'delayLeave', leave => {
delayedLeave = leave delayedLeave = leave
}) }, key)
} }
} }

2
src/platforms/web/runtime/modules/transition.js

@ -100,7 +100,7 @@ export function enter (vnode: VNodeWithData) {
pendingNode.elm._leaveCb() pendingNode.elm._leaveCb()
} }
enterHook && enterHook(el, cb) enterHook && enterHook(el, cb)
}) }, 'transition-insert')
} }
// start enter transition // start enter transition

Loading…
Cancel
Save