vue2使用swiper4踩坑的示例分析
导读：本文共1747字符，通常情况下阅读需要6分钟。同时您也可以点击右侧朗读，来听本文内容。按键盘←（左） →（右） 方向键可以翻页。
摘要： 前言一开始打算采用最新的swiper7，后来好像是vue2兼容性问题，各种报错，所以从7退回到6，然后退回到5,5则是遇到鼠标滚轮事件的bug，于是再度回滚，到4终于画风正常了。首先是引入npmiswiper↑这句话不是复制的，是因为出错太多，反复引用导致了可以直接手打的地步。值得一提的是，下载会默认下载7，直接用艾特符号标定不如直接改版本重新... ...
目录
(为您整理了一些要点),点击可以直达。
一开始打算采用最新的swiper7，后来好像是vue2兼容性问题，各种报错，所以从7退回到6，然后退回到5,5则是遇到鼠标滚轮事件的bug，于是再度回滚，到4终于画风正常了。
首先是引入
↑这句话不是复制的，是因为出错太多，反复引用导致了可以直接手打的地步。
值得一提的是，下载会默认下载7，直接用艾特符号标定不如直接改版本重新下，此时需要在package.json里面调成版本4后重新下载
其他软件不清楚是否是必须。
如果焦急的你看到这篇博客，而且不介意回滚到4的话，可以下载版本4，随后在需要轮播图的地方引入这三句话
这样就可以去官网拷代码了。new Swiper写在mouted里面。
我的代码：
最简单的一个，前进后退的属性
官网3的示例：
官网的版本7的示例:
这里采用的是官网版本7才能生效
绝大部分都是官网 7生效，但是小部分却是要版本4才能生效。
还有一个极致坑爹的属性，滚轮
省略*你妈买菜必超级加倍，跳广场舞永无C位*等脏话。
官网的官方api、swiper3以及swiper7的示例都是同一句
mousewheelControl : true,
但是，也许是swiper4特供，也许是各种不可名状的bug，真正在swiper4可用的代码是
如果你的轮播数据来源是请求数据，那么需要补上一句
observer: true,//修改swiper自己或子元素时，自动初始化swiper
或者干脆做的更绝，直接在list监听里面写
这样可以保证在请求完成之后再执行插件。
可能是scss文件未安装。vue-awesome-swiper 的scss文件要单独安装。并不随包一块导入。 cnpm install --save swiper swiper/swiper-bundle.css swiper/swiper.scss
vue2使用swiper4踩坑的示例分析的详细内容，希望对您有所帮助，信息来源于网络。