微信小程序开发3——小程序图片轮转功能的实现

这次讲一下通过swiper标签来实现小程序中图片的轮转功能，来点实际的，现放代码和效果图，然后进行再讲解
.wxss
swiper{
width:100%;
height:calc(100vw * 263 / 439);
}
.wxml

效果图展示：

下面讲解一下所用到的标签和属性吧
swiper：滑块视图容器。其中只可放置swiper-item组件，否则会导致未定义的行为
autoplay 是否自动切换
interval 自动切换时间间隔
indicator-color 指示点颜色
indicator-active-color 当前选中的指示点颜色
接下来重要的一点就是wxss中swiper高度的计算了，首先你先要知道你要上传图片的原始高度和宽度（可以保存到本地点击属性进行查看），这里直接给出计算公式：*swiper高度=swiper宽度（100vw）原图的高度/原图的宽度
以上就是图片轮转功能的实现了。