Vue框架在项目开发中如何实现组件的复用？

本文共计2121个文字，预计阅读时间需要9分钟。

目录

一、Vue中的transition组件

二、transition组件应用CSS过渡

（1）单元素过渡 （2）多个元素过渡 （3）多个组件过渡 （4）列表过渡

三、JavaScript钩子

一、Vue中的transition组件

目录

• 一、vue里面的transition组件
• 二、transition组件应用CSS过渡
• （1）单元数/组件过渡
• （2）多个元素过渡
• （3）多个组件过渡
• （4）列表过渡
• 三、JavaScript钩子

一、vue里面的transition组件

Vue提供了这个transition组件，可以使得在v-if条件渲染、v-show条件显示、动态组件的时候可以给到任意元素和组件添加了进入或离开元素过渡。

二、transition组件应用CSS过渡

在应用css过渡的时候，transition组件会在恰当的时候添加、删除元素。我们的transition组件包含了一下6类过渡类别；

• v-enter：定义在进入过渡的时候，元素在插入之前生效，在元素被插入之后的下一帧溢出。
• v-enter-active：在定义的时候，在过渡生效的状态，在整个进入过渡的阶段中应用，在元素被插入前生效，在过渡完成之后移除。