vue实现多个元素或多个组件之间动画效果

原创 Fly丶 教程 vue专题 50阅读 17 天前 举报

多个元素的过渡

按照之前的写法方式,渐隐渐出的效果并没有出现该有的效果,那么为什么呢?
在if else两个元素切换的时候,会尽量的复用dom,正是vue,dom的复用,导致动画的效果不会出现,如果想要vue不去复用dom,之前也说过,怎么做呢,给两个div不同的key值就行了

这样就可以有个明显的动画效果,多个元素过渡动画的效果。

transition还提供了一个mode属性,in-out是先显示再隐藏,out-in是先隐藏再显示

多个组件的过渡

这个就是多个组件的过渡,采用的是上面的方式,替换子组件,那么我们换一种方式,用动态组件

这样也实现了多个组件的过渡效果。

评论 ( 0 )
最新评论
暂无评论

赶紧努力消灭 0 回复