安装vue-awesome-swiper插件
1.注意,有坑
通过 npm install --save vue-awesome-swiper 安装的最新插件,在运行过程中你会发现,图片并不是一张张的轮播,要么整个swiper-container在左右轮播,要么是图片不显示(尽管路径是正确的)
解决方案:
之前安装的swiper依赖删掉,通过 npm install vue-awesome-swiper@2.5.4 -S 安装固定版本，并重新运行npm run dev 即可解决非正常轮播的问题.
2.引用swiper
可以在main.js里面直接配置,具体如下:
1.import Vue from 'vue'
2.import VueAwesomeSwiper from 'vue-awesome-swiper'
3.Vue.use(VueAwesomeSwiper)
也可以在模板中引用
1.import { swiper, swiperSlide } from 'vue-awesome-swiper'
2.components: { swiper, swiperSlide }
下面的代码该怎么写就怎么写啦
个人建议,swiper不需要设置成全局的，这样反倒会拖累整个项目性能，我们哪里需要就在哪里引入.
喜欢的话,还请点个赞哟(≧▽≦)/啦啦啦
