為什麼實現不了手風琴?
<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,
}
不知道你這裡的是不是就是完整的程式碼了,我對你的程式碼稍作修改之後就能正常運作了。程式碼的邏輯和CSS樣式寫得沒有問題。如果上面就是你的完整程式碼,那上面的錯誤在於,你沒有掛載實例。