Skip to content

悬浮操作按钮 (Floating Action Buttons)

v-fab 组件可以用作悬浮操作按钮。它提供了一个主要操作入口。

TIP

此特性自 v3.6.0 版本引入。

使用

浮动操作按钮可以附加到材料上以表示应用程序中的升级操作

API

组件描述
v-fab主要组件

示例

下面的例子用于展示 v-fab 组件更为高级和更为贴近实际情况的用法。

显示动画

当第一次显示该组件时,使用动画效果来展示。因此例子中我们使用了 v-fab-transition 和 v-show。当然你可以使用 Vuetify 提供的任何的效果或者你自定义的效果。

横向屏幕切换

当按钮的默认操作发生了更改时,推荐使用过渡效果来表现它的变化。例子中通过绑定 key 属性到一些数据上,并通过 Vue 的过渡系统来发送改变的信号。

小型按钮

为了达到更好的视觉效果,我们可以使用小型按钮以适配列表的头像。