选项卡面板

选项卡面板是一种使用更少的窗口空间显示更多信息的方法。

TIP

QTabs一起使用时效果很好,但不需要与它一起使用。

安装

/*
 * No installation step is necessary.
 * It gets installed by default by @quasar/app v2+.
 */

用法

TIP

QTabs配合使用非常好,该组件提供了一种选择要显示的活动选项卡面板的好方法。

重要

不要被“QTabPanels”组件名称误解了。 面板不需要QTab。 它们也可以独立使用。

WARNING

如果需要这种行为,请注意QTabPanels的布尔值keep-alive属性。 不要在QTabPanel上使用Vue的原生<keep-alive>组件。

基础

Basic

使用QTab

TIP

QTabPanels也可以独立使用。 它们不依赖于QTab的存在。 而且,它们可以放置在页面中的任何位置,而不仅仅是QTabs。

With QTabs
A more complex example

着色

Coloring

带有垂直QTab和QSplitter

With vertical QTabs and QSplitter

有关过渡的完整列表,请查看过渡.

自定义过渡

Custom transition examples

在下面的示例中,使用鼠标在面板上滑动,或者在具有触摸功能的设备上,用手指滑动。

可滑动和无限

Swipeable and infinite

QTabPanels API

Loading API...
Please wait...

QTabPanel API

Loading API...
Please wait...