核心提示:Vue.js的学习1.71.vue动画运动东西(元素,属性、路由.)class定义:.fade-enter{} //初始状态.fade-enter-active{} //变化成什么样 - 当元素出来(...
Vue.js的学习1.7
1.vue动画
运动东西(元素,属性、路由….)
class定义:
.fade-enter{} //初始状态
.fade-enter-active{} //变化成什么样 -> 当元素出来(显示)
.fade-leave{}
.fade-leave-active{} //变成成什么样 -> 当元素离开(消失)
.fade-enter-active, .fade-leave-active{
transition: 1s all ease; //设置时间1秒
}
.fade-enter-active{
opacity:1;
width:300px;
height:300px;
}
.fade-leave-active{
opacity:0;
width:100px;
height:100px;
}
.fade-enter,.fade-leave{
opacity:0;
width:100px;
height:100px;
}


