微信小程序开发一swiper轮播图的简单实现

swiper是温馨小程序里面提供实现轮播图效果的一个的很好的组件，使用非常简单。

下面直接看我的代码

data: {
    imgUrls: [
      'http://img4.imgtn.bdimg.com/it/u=853537835,3029652797&fm=23&gp=0.jpg',
      'http://img0.imgtn.bdimg.com/it/u=1582567067,766279201&fm=23&gp=0.jpg',
      'http://img4.imgtn.bdimg.com/it/u=1489243952,524930210&fm=23&gp=0.jpg',
    ],
    indicatorDots: true,
    autoplay: true,
    interval: 5000,
    duration: 1000
  },
  changeIndicatorDots: function (e) {
    this.setData({
      indicatorDots: !this.data.indicatorDots
    })
  },
  changeAutoplay: function (e) {
    this.setData({
      autoplay: !this.data.autoplay
    })
  },
  intervalChange: function (e) {
    this.setData({
      interval: e.detail.value
    })
  },
  durationChange: function (e) {
    this.setData({
      duration: e.detail.value
    })
  },

下面是实现的效果图：

具体参数可以到官方的Demo：

https://mp.weixin.qq.com/debug/wxadoc/dev/component/swiper.html