vue 动画过渡 手风琴

Question

为什么实现不了手风琴？<style>    .collapse-enter{        max-height: 0;    }    .collapse-enter-active {        max-height: 10rem;        -webkit-transition: all .3s cubic-bezier(1.0, 0.5, 0.8, 1.0);        transition: all .3s cubic-bezier(1.0, 0.5, 0.8, 1.0);    }    .collapse-leave {        max-height: 10rem;    }    .collapse-leave-active {        max-height: 0;        -webkit-transition: all .3s cubic-bezier(1.0, 0.5, 0.8, 1.0);        transition: all .3s cubic-bezier(1.0, 0.5, 0.8, 1.0);    }</style><h1 @click="detail = !detail">Title</h1><transition name="collapse">    <p v-show="detail">        在纽约长岛的一家餐吧里有一只132岁的大龙虾。这只纽约最老的龙虾名叫Louie，重22磅（约20斤），20年来，它一直生活在一家餐吧里，餐吧主人Butch Yamali就像养了一只宠物一样，把它养在水族箱里。    </p></transition>data: {    detail: false,}