swiper匀速轮播第一遍是正常匀速的，加完loop第二遍为什么出现卡顿了？

loop模式：会在原本slide前后复制若干个slide(默认一个)并在合适的时候切换，让Swiper看起来是循环的。 所以设置loop:true与抖动无关。

animation-timing-function:linear说明动画从头到尾的速度是相同的。也不影响。

# 设置loop为true时滚动echarts的时候会有一些空白页面出现

原因其实很简单，loop为true的时候，swiper为了能够向一个方向进行滚动进行了一些简单的dom复制 *** 作，而在复制的过程中没有将canvas复制进去，所以产生了空白页

## 解决办法：1、利用swiper的回调函数找到当前的activeIndex判断滚动的页面重新绘制echart图

## 解决办法：2、vant的滚动组件不是单纯的复制dom，所以设置成持续像一个方向滚动时不会出现空白页面

## 鼠标停留时停止滚动，离开的时候开始滚动

```js

    //在mouseleave事件触发的时候调用

        swiper.stopAutoplay()

  //在mouseenter事件触发的时候调用

        swiper.startAutoplay()

```

###自己犯傻的一个问题，但是我用的是vue-awesome-swiper，我在组件上用了@mouseleave和mouseenter的时候怎么都不触发事件，把我给整傻了，仔细想了下其实加上native修饰符就可以了，顺便记录下mouseover和mouseenter的区别

mouseover和mouseenter的区别

大概区别就是mouseover在目标内部进入子节点后会重复的多次触发事件，而mouseenter进入后只会触发一次

```

mouseover和mouseout 是一对

mouseenter和mouseleave是一对

```

（带o的是一对，不带o的是一对，带o的不止触发once）

你如果设置了slidesPerview就需要为loopedSlides设置一个值。示例：

loop : true,

slidesPerView : 'auto',

loopedSlides :8,

Swiper 是纯javascript打造的滑动特效插件，面向手机、平板电脑等移动终端，以及PC端网站。

Javascript，一种高级编程语言，通过解释执行，是一门动态类型，面向对象（基于原型）的直译语言。它已经由欧洲电脑制造商协会通过ECMAScript实现语言的标准化。它被世界上的绝大多数网站所使用，也被世界主流浏览器（Chrome、IE、FireFox等）支持。

JavaScript是一门基于原型、函数先行的语言，是一门多范式的语言，它支持面向对象编程，命令式编程，以及函数式编程。

它提供语法来 *** 控文本、数组、日期以及正则表达式等，不支持I/O，比如网络、存储和图形等，但这些都可以由它的宿主环境提供支持。

---