Vue-Transition(过渡动画)

原创 疯狂weber 教程 VUE 176阅读 2018-08-17 10:25:27 举报

过渡动效

  • 提供了Transition的封闭组件
  • 添加删除CSS类名

Transition组件

name:指过渡CSS类名
mode:过渡模式

  • in-out:新元素先进行过渡,完成之后当前元素过渡离开
  • out-in:当前元素先进行过渡,完成之后新元素过渡进入

过渡CSS类名

v-enter:定义进入过渡的开始状态
v-enter-active:定义进入活动状态
v-enter-to:定义进入的结束状态

v-leave:定义离开过渡的开始状态
v-leave-active:定义离开的活动状态
v-leave-to:定义离开的结束状态

注:前置“V”可以自定义名称,供name使用,例如"left-enter"使用时name="left"

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

赶紧努力消灭 0 回复