轮播组件Swiper使用教学 轮播图篇

swiper主要适用于pc端和移动端 主要就是用来实现轮播图效果

 

swiper5官方网址如下：​​​​​​​https://www.swiper.com.cn/api/index.html  ​​​​​​​

下载Swiper后解压然后找到如下图所示文件夹

package中js文件夹

我们需要js 和css文件夹

官网中的中文教程有使用方法

<script>        
  var mySwiper = new Swiper ('.swiper', {
    direction: 'vertical', // 垂直切换选项
    loop: true, // 循环模式选项
    
    // 如果需要分页器
    pagination: {
      el: '.swiper-pagination',