使用動畫效果要用transition包裹，transition(<trsnsition name="xx"><div></div></transition>)是將所包裹的單個元素賦予過渡效果。當元素被transition包裹之后，vue會自動分析里面元素的css樣式，然后構建一個動畫流程
顯示：
在動畫即將執行的瞬間，會在內部元素上面增加兩個class(xx-enter, xx-enter-active),當動畫第一幀執行結束后，發現有動畫效果，vue在動畫運行到第二幀的時候，去掉xx-enter類，加上xx-enter-to類，接着當動畫結束時vue會把之前添加的xx-enter-active，xx-enter-to去掉.
隱藏：
使用css3動畫@keyframes,自定義類名
使用Animate.css庫
ps:刷新即顯示動畫
同時使用transition過渡動畫和css動畫，設置優先時間
自定義動畫播放時長 :duration="10000" 持續10s
自定義復雜動畫播放時長:入場時間，出場時間
使用js鈎子實現入場動畫
使用js鈎子實現出場動畫
使用Velocity.js實現動畫
多個元素的過渡效果
ps：out-in先隱藏再展示 in-out先展示在隱藏
多個組件的過渡效果
列表過渡
動畫封裝
