微信小程序swiper fraction数字导航
在做小程序的时候,收到的设计图是这样的
一般来说小程序的圆点导航用的比较多,官方文档也介绍了如何改变圆点导航样式,但是如何像swiper4那样将paginationType改为fraction呢。虽然没有像swiper那样有paginationType属性,但是文档中mode参数有一个字段为current
再通过bindchange事件,将当前页数渲染到页面上。
wxml:
<view class='abs newPro-pagination ft16'>{{swiperIndex}}<text class='ft12'>/{{mainData.newGoods.length}}</text></view>
js:
swiperChange:function(e){
var current = e.detail.current
this.setData({
swiperIndex : current+1
})
}