微信小程使用swiper组件实现图片轮播切换显示功能【附源码下载】

微信小程使用swiper组件实现图片轮播切换显示功能【附源码下载】

本文实例讲述了微信小程使用swiper组件实现图片轮播切换显示功能。分享给大TwpkI家供大家参考，具体如下：

1、效果展示

2、关键代码

index.wxml：

swiper组件属性说明如下：

属性名

类型

默认值

说明

最低版本

indicator-dots

Boolean

false

是否显示面板指示点

indicator-color

Color

rgba(0, 0, 0, .3)

指示点颜色

1.1.0

indicator-active-color

Color

http:// #000000

当前选中的指示点颜色

1.1.0

autoplay

Boolean

false

是否自动切换

current

Number

0

当前所在页面的 index

interval

Number

5000

自动切换时间间隔

duration

Number

500

滑动动画时长

circular

Boolean

false

是否采用衔接滑动

vertical

Boolean

false

滑动方向是否为纵向

bindchange

EventHandle

current 改变时会触发 change 事件，event.detail = {current: current, source: source}

3、源代码点击此处本站下载。

关于swiper详细说明还可参考官方文档：https://mp.weixin.qq.com/debug/wxadoc/dev/component/swiper.html

希望本文所述对大家微信小程序开发有所帮助。

版权声明：本文内容由网络用户投稿，版权归原作者所有，本站不拥有其著作权，亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容，请联系我们jiasou666@gmail.com 处理，核实后本网站将在24小时内删除侵权内容。