关于一次swiper无限滚动的开发笔记

项目需求很简单，某个类目，横向排布。超出自动横向无缝滚动。自然而然想到直接使用swiper。
第一步，安装swiper

npm install vue-awesome-swiper --save

第二步项目中引入

import Swiper from "swiper";
import "swiper/dist/css/swiper.min.css";

第三步在需要使用的组件中使用

html：
   
     

  {{item.categoryName}}
  {{item.unitPrice}}元/每斤

     
   
  js：
  var mySwiper1 = new Swiper(".swiper-container1", {
    loop: true,
    speed: 4000, //匀速时间
    slidesPerView: 4,
    spaceBetween: 30,
    autoplay: {
      delay: 0,
      stopOnLastSlide: false,
      disableOnInteraction: false
    }
    });

第四步：需要对swiper本身的css样式进行修改。

.swiper-container1 {
  .swiper-wrapper {
    transition-timing-function: linear !important;
  }
}