vue-awesome-swiper使用
安装 npm install --save vue-awesome-swiper
应用main.js中 import Vue from ‘vue’
import VueAwsomeSwiper from 'vue-awsome-swiper'
Vue.use（VueAwsomeSwiper）
组件中应用 import {swiper,swiper-slide} from 'vue-awsome-swiper'
组件中引用 components:{slide,swiper-slide}
-------------------------------------------------------
组件使用
<template>
<swiper :options="swiperoption"></swiper>
</template>
data:{
return {
swiperoption：{}中进行配置项
}}
----------------------------------------------------
属性设置 swiperoption中配置项
参考网站https://www.swiper.com.cn/api/index.html
****resistanceRatio 当activeindex为第一个和最后一个时没有反弹效果
****watchOverflow 只有一个时不进行拖动
direction：‘’滑动方向
allowSlidePrev是否可以向左 /向上滑动
allowSlideNext是否可以向右/向下滑动
preventInteractionOnTransition slide进行过度动画的时候无法滑动
----------------------
touchAngle允许识别的角度
threshold：number拖动距离超过数值时才触发
-----------------------------------
****on 注册事件 touchStart touchMove touchEnd 可以写双指事件
~~~~~~~~~~~~~~~~~~~******tap相当于移动端的点击事件
init初始化
---------------------------------------------------------------------------------
下面的使用率不是很高 按自己需求来
判断图片加载是否完成
preloadImages 强制加载图片
updateOnImagesReady 所有图片加载完
--------------------------------------
centerSlide 中间slide为activeslide
slidePreView可视区放几个slide
spaceBetween 中间空隙
slidesOffsetBefore与左边的偏差
freemode是否贴合
--------------------------------
slide中嵌套点击事件
preventClicks 滑动时阻止点击事件 默认阻止
slideClickedSlide 点击哪个哪个为active slide
--------------------
过渡时无法滑动 preventInteractionOnTransition
设置不可触摸滑动的元素 noSwipingSelector noSwipingClass ********不可滑动的元素 slide中嵌套有滚动事件的元素
allowSlideNext 可以滑动到下一个
allowSlidePre
-----------------------------------------------------
*******监听器 obsever
样式改动或者slide改动时重新初始化
obseverParent obseverSlideParent
-------------------------------
事件
init
touchStart
slideChangeTransition
imagesReady
updateOnImageReady
transitionEnd
reachBegining 初始化时
********************getTranslate
********************setTranslate 要结合progress来使用
changeDirection 改变走向
---------------
参数
activeIndex
params 可以重写参数 myswiper.params.speed=1000 ****重写参数 不是所有的参数都可以重写
^disableOnInteraction用户操作swiper时是否会禁止循环播放*******
disableOnInteraction
autoplay:boolean 是否自动滑动
