vue2.0过渡中v-enter-active钩子结束后v-leave-active钩子不生效？？

Question

<transition name="bounce">
    <div v-show="item.children && item.deploy">
      <ul class="childMenu">
        <li v-for="child in item.children" class="menuLi"  @click="clickCss(child)" :class="{'clicktoggle':isClickToggle(child)}">
          <span>{{ child.type }}</span>
        </li>
      </ul>
    </div>
  </transition>

----css

.bounce-enter-active, .bounce-leave-active {
  transition: all .9s ease;
  overflow: hidden;
  max-height:200px;
}
.bounce-enter, .bounce-leave-active {
  max-height: 0;
}

vue2写的demo，过渡效果是点击菜单收放。如果1秒钟内连续点击菜单的话过渡效果没问题。但是点击菜单一次展开（有过渡效果）后稍等一会再点击收回时就没有过渡效果。

查看原因可能是钩子函数.bounce-leave-active的问题，但是具体原因不知道出在哪里，跟官网的例子写的一样啊。。。麻烦大神们帮忙看下问题出在哪里？感激不尽！

Answer 1

多写了一个-active？