轮播图组件 之 vue组件vue-data-loading

前提：虽然 swiper样式效果相当的全面 但是太重是我不想要的 所以才找了下面的组件进行使用 如果小伙伴们有更好用的组件 希望能不吝分享。宗旨是 学海无涯 相互分享 共同进步 

1. vue-agile 官网地址https://github.com/lukaszflorczak/vue-agile

  demo源码编辑地址 https://codepen.io/collection/AdRzJW/

  项目需求如下左图， 而官方事例中是下右图

              

 

     直接修改源码显然不合适 而暴漏出来的属性设置也没有该模块的内容 所以我在此通过修改样式的方法 从右图变成左图  首先说下大概思路：

a:首先将缩略的轮播通过旋转放置到上图中的左图所示

b:其次位置通过绝对定位固定设置

c:整体旋转后会出现图片内容旋转的问题 这时候就需要将缩略滚动中的图片都旋转对应的度数即可 上图我是旋转了90deg 所以对应的图片要旋转-90deg即可

e:上述的三个步骤已经将样式完全修改好了 还有个需求就是 去除默认的循环和点击缩略图进行滑动的效果