transition效果出不来

Question

<div class="ab">
        <button @click="show0 = !show0">toggle</button>
        <transition name="slide-fade">
          <p v-show="show0">i am show</p>
        </transition>
      </div>

点击显示隐藏没有问题，但是就是效果出不来，难道fade需要自己定义一下效果时间才可以吗？没有默认效果？

Answer 1

fishenal 2017-10-27 14:19:19

是自定义的，通过css3动画

.slide-trans-enter-active {

  transition: all .5s;

}

.slide-trans-enter {

  transform: translateX(900px);

}

.slide-trans-old-leave-active {

  transition: all .5s;

  transform: translateX(-900px);

}

比如这样，slide-trans是transition的name

Answer 2

提问者 英姿飒爽豆腐块 2017-10-27 10:29:16

大概知道了，这个应该是自己手动添加类的效果才行，本身没有默认的