下面的組件有大量的數據，最初，這些數據是部分隱藏的。當用戶單擊以展開時，“dataExpanded”屬性被設置為true，并且“data-not-expanded”類被移除，從而移除溢出和有限高度屬性。我需要的是，當刪除限制高度時，顯示一個平滑的擴展過渡，而不是突然改變組件的高度。我該如何歸檔呢？我正在使用vue和vuetify，但不確定它們是否有幫助，因為過渡不是基于簡單的v-if或v-show。

<car-page-data
            :class="{
              'data-not-expanded': !dataExpanded,
            }"
            :car="car"
          />

風格:

.data-not-expanded {
  height: 400px;
  overflow: hidden;
}