使用swiper实现视频和图片混合轮播

完成需求：轮播页面自动滚动循环播放素材，在视频页面自动播放视频至视频结束后继续轮播下一个素材，手动切换时视频页暂停播放，切换回来后恢复播放。

1.安装swiper相关插件

2.在轮播页面引入

import { Swiper, SwiperSlide } from "vue-awesome-swiper";

import "swiper/swiper-bundle.css";

import Swiper2, {  Autoplay } from "swiper";

Swiper2.use([Navigation, Pagination, EffectFade, Autoplay]);

此处特别注意，自动播放Autoplay 需要单独引入，因为swiper单独对Autoplay 进行了打包操作，如果未引入会导致设置自动播放属性无效

3.轮播结构

<swiper
            v-if="carouselList.length>0"
            class="carousel swiper-container"
            ref="mySwiper"
            @slideChange="onSlideChange"
            :options="swiperOption"
          >
            <swiper-slide