Transition

Vue 3 Transition组件可以封装成独立组件实现复用，也可以通过动态name和动态props实现运行时切换动画效果。本文讲解如何用插槽封装可复用Transition组件、动态过渡的实现方式、以及TransitionGroup组件的 …

Vue 3 Transition组件在使用中有不少容易忽略的细节：嵌套元素的过渡如何处理、duration属性怎么用、appear让元素首次渲染也有动画、key属性如何触发过渡。本文逐一拆解这些细节，帮你避开坑。

Vue 3 Transition组件在多个元素切换时，默认是同时执行进入和离开动画，容易导致布局重叠。本文详解过渡模式mode=“out-in"和mode=“in-out"的区别 …

Vue 3 Transition组件提供了8个JavaScript钩子事件，让你可以在动画的不同阶段执行JS代码。本文详解每个钩子的触发时机、:css=“false"的用法、以及如何配合GSAP实现CSS做不到的复杂动 …

Vue 3 Transition组件支持自定义过渡类名，让你可以直接用Animate.css等第三方动画库的类名。本文讲解6个自定义类名prop、Animate.css集成方法、同时使用transition和animation时type属性 …

Vue 3的Transition组件是内置的动画利器，本文从Transition组件的基本概念讲起，搞清楚它什么时候触发、6个CSS过渡类名分别干啥、命名过渡怎么用、CSS transition和CSS animation两种方式的区别。