vue的动画可以分为两种
一种是动画效果, 另一种叫过渡效果
当然, 如果不使用 vue 的动画, 我们自己来使用 css3 写出一个关键帧动画, 也是可以的
要使用vue 的动画, 我们首先要在, 动画的元素上面 加上 transition 在 transition元素上, 可以添加
name 为动画指定一个标识
appear 设置节点在初始渲染的过渡 如果 appear = true 表示在页面 第一次加载的时候就使用动画
下面来展示一下 第一种动画效果的代码
上面的代码属于关键帧的动画
vue的transition 标签在使用过程中, 会在适当的时机, 自动为动画的元素加上三个类名
.v-enter 动画的起点
.v-enter-active 动画进入的过程中
.v-enter-to 动画起始后的终点
/////////////////////////////////////////////////////////////////////////////////////////////////////////////////
.v-leave 动画离开是的起点
.v-leave-active 动画离开的过程中
.v-leave-to 动画离开的终点
下面我们来说一下 过渡动画
过渡动画, 就是我们 为动画的元素指明 起点时的样子 和 终点是的样了, 再指明动画时长, 是否匀速等, 从代码中说明情况
以上就是 vue 动画的两种方式