vue项目,如果要使用轮播,能做动画的只有vue-awesome-swiper了,除非牛人自己造轮子,但是vue-awesome-swiper是需要swiper的支持,而现在swiper已经出到6了,swiper的官网明确表示6只能支持vue3.0,而且官网没有旧版本的api文档,这就表示,目前主流的2.0项目,想用它真的就只能瞎子过河,摸不着边了。

而且swiper的动画,是需要魔改代码的,因为动画的那个js文件需要改动,然后动画使用的animate.css也因为版本大改,导致使用起来越发的摸不着头脑,百度到的都是旧的教程,为此我特意研究了下,终于是“完美”使用了,为此出个教程。

废话不多说,先上图演示:

教程

此处内容已隐藏回复后方可阅读。

分类: vue 项目实战 标签: vue轮播Animate.cssswipervue-awesome-swiper轮播动画swiperAnimatedswiper.animate

评论

全部评论 39

  1. jqk
    jqk
    Google Chrome Windows 10
    瞧瞧
  2. 生
    Google Chrome Windows 10
    收到
  3. 问问
    问问
    Google Chrome Windows 10
    参考一下
  4. jqk
    jqk
    Google Chrome Windows 10
    瞅瞅
  5. yunfeiyang
    yunfeiyang
    Google Chrome Windows 10
    最后不需要引入animate.css吗?
  6. yunfeiyang
    yunfeiyang
    Google Chrome Windows 10
    看一下哈
  7. 古哥
    古哥
    FireFox Windows 10
    来看看,万一哪天用的上呢

目录