前言：vue有许多开源组件提供使用，其中awesome-swiper组件就可以非常方便的创建各式各样的轮播图，下面来看看如何使用这个组件。
注：此文档为2018年撰写，不适用于最新版swiper
一、关于vue-awesome-swiper组件
一个开源的轮播图组件，github地址及官网见下，关于安装步骤及使用都介绍得十分清楚。
github地址：https://github.com/surmon-china/vue-awesome-swiper
官网：https://www.swiper.com.cn/api/index.html
二、在项目中使用awesome-swiper
1、安装依赖
npm install vue-awesome-swiper --save
2、引入awesome-swiper
支持全局引入和在组件中引入2种方式，如果项目中只有一个轮播的话推荐在组件中引入，有多个轮播则推荐在全局中引入。
（1）全局引入方式，在main.js中添加以下代码
（2）组件中引入，在需要引入轮播图的.vue文件中添加以下代码
3、组件内调用轮播图
支持SPA(single page web application，单页Web应用）和SSR（Server Side Rendering，服务端渲染）2种模式，SPA通过ref属性来查找swiper实例，而SSR借助命令参数查找swiper实例，在使用方面2种模式都是一样的。
（1）SPA模式
HTML结构见下，分页器、向左向右滚动按钮、滚动条等都是可选的，如不需要注释掉即可
script中关于轮播图的设置见下，更多的API可以看这里：http://www.swiper.com.cn/api/index2.html
效果见下
（2）SSR模式
