学习笔记_微信小程序开发--Swiper的使用

Swiper的使用

.js文件

var imgUrls = [=
    { image: "http://www.padmag.cn/wp-content/uploads/Unforgiven.jpg" },
  { image: "http://www.padmag.cn/wp-content/uploads/Desire.jpg" },
  { image: "http://www.padmag.cn/wp-content/uploads/No_Goodbye.jpg" },
  { image: "http://www.padmag.cn/wp-content/uploads/Look_Away.jpg" }
]·
Page({
  data: {
imgUrls: imgUrls,
autoplay: true,//是否自动切换  
indicatorDots: true,//是否显示圆点  
interval: 5000,//自动切换间隔  
duration: 500, //滑动动画时长  
indicatorColor: "blue",//滑动圆点颜色  
indicatorActiveColor: "white", //当前圆点颜色  
current: 2, //当前所在页面的 index  
circular: true  //是否采用衔接滑动  
//其中只可放置组件，否则会导致未定义的行为。  
  }, imageLoad: function () {
//bindload 图片加载的时候自动设定宽度  
this.setData({
  imageWidth: wx.getSystemInfoSync().windowWidth
})
  }, swiperChange: function () {
console.log("current 改变时会触发 change 事件")
  }
})  

.wxml文件