过渡动画

流畅的动画有助于给用户界面带来很棒的感觉。使用 Vue 的过渡系统和可复用的功能组件，你可以轻松地控制应用程序的动画效果。大多数组件可以通过 transition 属性来改变他们的过渡效果。

API

名称	描述
v-expand-transition	展开转换用于展开面板和列表组。也有一个水平版本可用 v-expand-x-transition.
v-fab-transition	在 v-speed-dial 组件中可以找到fab过渡的示例.
v-fade-transition	在 Carousel 组件上可以找到淡入淡出过渡的示例。
v-scale-transition	许多 Vuetify 组件都包含一个 transition 属性允许你指定想要的效果。
v-scroll-x-transition	X 轴滚动会使动画沿着水平轴线方向。
v-scroll-y-transition	Y 轴滚动会使动画沿着垂直轴线方向。
v-slide-x-reverse-transition	从右边滑动X反转过渡。
v-slide-x-transition	滑动X过渡从左边滑动进来。
v-slide-y-reverse-transition	滑动Y反向过渡从底部滑动进来。
v-slide-y-transition	Y型转场从顶部滑入。
v-tab-reverse-transition	选项卡反转过渡从右侧滑动。
v-tab-transition	制表符从左侧滑动。
v-toggle-slide-x-reverse-transition	拨动“滑动X”按钮，从右边开始反向滑动。
v-toggle-slide-x-transition	切换X从左边滑动。
v-toggle-slide-y-reverse-transition	切换“滑动Y”，反转从底部滑动。
v-toggle-slide-y-transition	Y过渡从顶部滑动。

示例

其他

Expand x

展开转换用于展开面板和列表组。也有一个水平版本可用 v-expand-x-transition。

Fab

在 v-speed-dial 组件中可以找到fab过渡的示例。

Fade

在 Carousel 组件上可以找到淡入淡出过渡的示例。

Scale

许多 Vuetify 组件都包含一个 transition 属性允许你指定想要的效果。

Scroll x

X 轴滚动过渡沿着水平轴继续。

Scroll y

Y 轴滚动过渡沿着垂直轴继续。

Slide x

X 轴滑动过渡可沿水平方向移动。

Slide y

动画使用应用程序的 $primary-transition。

Todo list

使用多个自定义转场，可以轻松实现简单的待办事项清单！