vue的动画和过渡

toggle

动画内容

.fade-enter-active, .fade-leave-active {
  transition: all .5s;
}

/*.fade-enter, .fade-leave-to {
  opacity: 0;
}*/
.fade-enter{
    transform: translate(-100px,0);
}

.fade-leave-to /* .fade-leave-active below version 2.1.8 */ {
    transform: translate(500px,0);
}

const vm = new Vue({
    el: ‘#app‘,
    data:{
        isShow: true
    },
    methods:{
        toggle(){
            this.isShow = !this.isShow
        }
    }
});

原文地址：https://www.cnblogs.com/bao2333/p/10133695.html