关于transition使用css类名和钩子函数的区别

关于transition使用css和钩子函数的区别

使用transition最简单的方法
transition需要与如下情景中的任一种一起使用:

v-if(条件渲染)

v-show(条件展示)

动态组件
简单示例:

 <div>
   <button @click="show=!show">show</button>
   <transition name="fade">
     <p v-show="show">hello</p>
   </transition>
 </div>

实现动画效果可以使用v-enter、v-enter-active、v-leave-active和v-leave-to四个类名,会实现动画的入场和出场效果,但是有时候在只需要入场或出场效果时,需要使用transition的钩子函数实现,before-enter、enter、after-enter等。

你可能感兴趣的:(一些属性)