You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
29 lines
709 B
29 lines
709 B
7 years ago
|
import animate from './css-animation'
|
||
|
|
const noop = () => {}
|
||
|
|
const getTransitionProps = (transitionName, opt = {}) => {
|
||
|
|
const { beforeEnter, enter, leave, afterLeave, appear = true, tag } = opt
|
||
|
|
const transitionProps = {
|
||
|
|
props: {
|
||
|
|
appear,
|
||
|
|
css: false,
|
||
|
|
},
|
||
|
|
on: {
|
||
|
|
beforeEnter: beforeEnter || noop,
|
||
|
|
enter: enter || ((el, done) => {
|
||
|
|
animate(el, `${transitionName}-enter`, done)
|
||
|
|
}),
|
||
|
|
leave: leave || ((el, done) => {
|
||
|
|
animate(el, `${transitionName}-leave`, done)
|
||
|
|
}),
|
||
|
|
afterLeave: afterLeave || noop,
|
||
|
|
},
|
||
|
|
}
|
||
|
|
// transition-group
|
||
|
|
if (tag) {
|
||
|
|
transitionProps.tag = tag
|
||
|
|
}
|
||
|
|
return transitionProps
|
||
|
|
}
|
||
|
|
|
||
|
|
export default getTransitionProps
|