vue2.0 transition用法

html:

<div id="demo">
  <button v-on:click="show = !show">
    Toggle
  </button>
  <transition name="fade">
    <p v-if="show">hello</p>
  </transition>
</div>
 
data:{
  return {
    show:true
  }
}
 
css:
 .fade-enter-active, .fade-leave-active {
  transition: transform .5s
  }
 .fade-enter, .fade-leave-active {
  transform: translate3d(0,-100%,0);
 }
posted @ 2017-02-24 15:54  百年美  阅读(3999)  评论(2编辑  收藏  举报