mirror of https://github.com/vuejs/core.git
wip: handle props update
This commit is contained in:
parent
af2eb2dbf5
commit
1540002f32
|
@ -22,7 +22,7 @@ import { currentInstance, isVaporComponent } from './component'
|
|||
import type { DynamicSlot } from './componentSlots'
|
||||
import { renderEffect } from './renderEffect'
|
||||
import { VaporVForFlags } from '../../shared/src/vaporFlags'
|
||||
import { applyTransitionEnterHooks } from './components/Transition'
|
||||
import { applyTransitionHooks } from './components/Transition'
|
||||
|
||||
class ForBlock extends VaporFragment {
|
||||
scope: EffectScope | undefined
|
||||
|
@ -318,7 +318,7 @@ export const createFor = (
|
|||
|
||||
// apply transition for new nodes
|
||||
if (frag.$transition) {
|
||||
applyTransitionEnterHooks(block.nodes, frag.$transition)
|
||||
applyTransitionHooks(block.nodes, frag.$transition)
|
||||
}
|
||||
|
||||
if (parent) insert(block.nodes, parent, anchor)
|
||||
|
|
|
@ -16,7 +16,7 @@ import {
|
|||
performTransitionLeave,
|
||||
} from '@vue/runtime-dom'
|
||||
import {
|
||||
applyTransitionEnterHooks,
|
||||
applyTransitionHooks,
|
||||
applyTransitionLeaveHooks,
|
||||
} from './components/Transition'
|
||||
|
||||
|
@ -85,7 +85,7 @@ export class DynamicFragment extends VaporFragment {
|
|||
this.scope = new EffectScope()
|
||||
this.nodes = this.scope.run(render) || []
|
||||
if (transition) {
|
||||
this.$transition = applyTransitionEnterHooks(this.nodes, transition)
|
||||
this.$transition = applyTransitionHooks(this.nodes, transition)
|
||||
}
|
||||
if (parent) insert(this.nodes, parent, this.anchor)
|
||||
} else {
|
||||
|
|
|
@ -43,16 +43,23 @@ export const VaporTransition: FunctionalComponent<TransitionProps> =
|
|||
let resolvedProps
|
||||
renderEffect(() => {
|
||||
resolvedProps = resolveTransitionProps(props)
|
||||
// only update props for Fragment block, for later reusing
|
||||
if (isFragment(children) && children.$transition) {
|
||||
children.$transition.props = resolvedProps
|
||||
} else {
|
||||
// replace existing transition hooks
|
||||
const child = findTransitionBlock(children)
|
||||
if (child && child.$transition) {
|
||||
child.$transition.props = resolvedProps
|
||||
applyTransitionHooks(child, child.$transition)
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
const hooks = {
|
||||
applyTransitionHooks(children, {
|
||||
state: useTransitionState(),
|
||||
props: resolvedProps!,
|
||||
} as VaporTransitionHooks
|
||||
applyTransitionEnterHooks(children, hooks)
|
||||
} as VaporTransitionHooks)
|
||||
|
||||
return children
|
||||
})
|
||||
|
@ -122,7 +129,7 @@ export function resolveTransitionHooks(
|
|||
return hooks
|
||||
}
|
||||
|
||||
export function applyTransitionEnterHooks(
|
||||
export function applyTransitionHooks(
|
||||
block: Block,
|
||||
hooks: VaporTransitionHooks,
|
||||
): VaporTransitionHooks {
|
||||
|
@ -130,20 +137,20 @@ export function applyTransitionEnterHooks(
|
|||
if (!child) return hooks
|
||||
|
||||
const { props, state, delayedLeave } = hooks
|
||||
let enterHooks = resolveTransitionHooks(
|
||||
let resolvedHooks = resolveTransitionHooks(
|
||||
child,
|
||||
props,
|
||||
state,
|
||||
currentInstance!,
|
||||
hooks => (enterHooks = hooks as VaporTransitionHooks),
|
||||
hooks => (resolvedHooks = hooks as VaporTransitionHooks),
|
||||
)
|
||||
enterHooks.delayedLeave = delayedLeave
|
||||
setTransitionHooks(child, enterHooks)
|
||||
resolvedHooks.delayedLeave = delayedLeave
|
||||
setTransitionHooks(child, resolvedHooks)
|
||||
if (isFragment(block)) {
|
||||
// also set transition hooks on fragment for reusing during it's updating
|
||||
setTransitionHooksToFragment(block, enterHooks)
|
||||
setTransitionHooksToFragment(block, resolvedHooks)
|
||||
}
|
||||
return enterHooks
|
||||
return resolvedHooks
|
||||
}
|
||||
|
||||
export function applyTransitionLeaveHooks(
|
||||
|
|
Loading…
Reference in New Issue