vue-轮播

• 安装swiper cnpm install --save swiper
• dom结构：

<template>
  <div class="swiper-container fileSwiper">
    <div class="swiper-wrapper">
       <slot></slot> <!--插槽 -->
    </div>
    <!-- 如果需要分页器 -->
    <div class="swiper-pagination"></div>
  </div>
</template>

• 引入swiper： import Swiper from 'swiper'

 mounted() {
    console.log("swiper-mounted");
    /* eslint-disable no-new */
    new Swiper(".fileSwiper", {  //构造函数初始化
      // direction: 'vertical'
      loop: true,
      autoplay: { // 自动轮播
      	deplay: 20000 // 2秒
      },
      // 如果需要分页器
      pagination: {
        el: ".swiper-pagination"
      }
    });
  }

• 构造函数报错的话就在上一行加上注释： /* eslint-disable no-new */，具体原因不知，能解决就可！

<script>
import swiper from './File/Swiper'
export default {
  components: {
    swiper
  }
}
</script>

• 引入组件： import swiper from '@/views/File/Swiper'
• 导入样式： import 'swiper/css/swiper.min.css'
• 测试轮播内容：

<swiper>
	<div class="swiper-slide" v-for="n in 10" :key="n">{{n}}</div>
</swiper>