給一個元素設計過渡,理想效果是出現時高度遞增，消失是高度遞減。
設計的程式碼如下：

.collapse-enter-active, .collapse-leave-active { transition: height .5s; } .collapse-enter, .collapse-leave-active { height: 0; } .collapse-leave { height: 100px; } .collapse-enter-active { height: 100px; }

結果元素出現時，高度直接到達100px，消失時正常，修改程式碼的順序如下：

.collapse-enter-active, .collapse-leave-active { transition: height .5s; } .collapse-enter-active { height: 100px; } .collapse-enter, .collapse-leave-active { height: 0; } .collapse-leave { height: 100px; }

問題解決了，不明白順序為什麼會造成影響，過渡效果不是在透過切換css來實現的麼，應該不是覆蓋的問題吧？
具體效果可以點選查看 jsbin