vue封装的动画与过渡

vue封装的动画与过渡

1.作用:在插入、更新或移除 DOM元素时，在合适的时候给元素添加样式类名
2.图示:
3.写法:
1.准备好样式:
元素进入的样式:
1.v-enter: 进入的起点
2.v-enter-active: 进入过程中
3.V-enter-to: 进入的终点
元素离开的样式:
1.v-leave: 离开的起点
2.v-leave-active: 离开过程中
3.v-leave-to: 离开的终点
2.使用包裹要过度的元素，并配置name属性:

<transition name="hello">
	<h1 v-show="isShow">你好啊!</h1></transition>
</transition>

3.备注:若有多个元素需要过度，则需要使用:且每个元素都要指定 key 值，且每个元素都要指定 key 值。