前端如何实现动画过渡效果

在css3出现之后，很多初学者最常用的动画过渡可能就是css3的能力了。大名鼎鼎的css动画库，谁用谁知道。不管是css3 transition 还是 css3 animation，我们简单使用都是通过切换class类名，如果要做回调处理，浏览器也提供了 ontransitionend ， onanimationend等动画帧事件，通过js接口进行监听即可。ok，这就是css动画的基础了，通过js封装也可以实现大部分的动画过渡需求，但是局限性在与只能控制css支持的属性动画，相对来说控制力还是稍微弱一点。传统和Vue/React框架对比通过前面的例子，无论是css过渡还是js过渡，我们都是直接获取到 dom元素的，然后对dom元素进行属性操作。Vue框架下的过渡动画可以先看一遍文档我们就不讲如何使用了，我们来分析一下Vue提供的transition组件是如何实现动画过渡支持的。