有一些 Quasar 元件透過 transition-show / transition-hide 或 transition-prev / transition-next 或僅僅 transition props 實現轉場效果

• transition-show / transition-hide

  • QBtnDropdown
  • QInnerLoading
  • QTooltip
  • QMenu
  • QDialog
  • QSelect (透過 QMenu 和 QDialog)
  • QPopupProxy (透過 QMenu 和 QDialog)

• transition-prev / transition-next

  • QCarousel
  • QTabPanels
  • QStepper

• transition

  • QIntersection

我們將在此展示這些轉場效果。

全部觸發

向右滑動

向左滑動

向上滑動

向下滑動

淡入淡出

縮放

旋轉

向右翻轉

向左翻轉

向上翻轉

向下翻轉

向右彈跳

向左彈跳

向上彈跳

向下彈跳

過場效果屬性請使用上方標題中指示的名稱。例如

<q-menu
  transition-show="jump-down"
  transition-hide="jump-up"
/>