vue学习指南:第十篇(详细) - Vue的 动画


Vue 提供了一些不同的过度效果,主要根 v-if v-show 动态组件

1. Vue给动画分了6个过程,在css中,扮演6个类,

1. .v-enter定义动画的开始状态

2. .v-enter-active 定义动画生效时的状态

3. .v-enter-to 定义动画的结束状态

4. .v-leave- 定义动画离开时开始状态

5. .v-leave-active 定义动画离开时的生效的状态

6. .v-leave-to 定义动画离开结束的状态

2. 给需要动画的元素,套一层 transition

3. 如果 transition 没有名字 默认类的名称以 .v-开头,如果加上name=“myname”,那么类的名称就得写成 .myname 开头

4. 自定义动画类 跟animate.css结合

作者:晋飞翔
手机号(微信同步):17812718961
希望本篇文章 能给正在学习 前端的朋友 或 以及工作的朋友 带来收获 不喜勿喷 如有建议 多多提议 谢谢!

优质内容筛选与推荐>>
1、Pycharm2019.1.3安装程序以及教程
2、cookie的基础以及小案例
3、技术语言框架学习方法论
4、Java 序列化和反序列化
5、用Python Copy文件的九种方法


长按二维码向我转账

受苹果公司新规定影响,微信 iOS 版的赞赏功能被关闭,可通过二维码转账支持公众号。

    阅读
    好看
    已推荐到看一看
    你的朋友可以在“发现”-“看一看”看到你认为好看的文章。
    已取消,“好看”想法已同步删除
    已推荐到看一看 和朋友分享想法
    最多200字,当前共 发送

    已发送

    朋友将在看一看看到

    确定
    分享你的想法...
    取消

    分享想法到看一看

    确定
    最多200字,当前共

    发送中

    网络异常,请稍后重试

    微信扫一扫
    关注该公众号