本文精讲Swiper所有属性，无需繁琐说明，直接上干货！
📌 基础显示控制
| 属性 |
类型 |
默认值 |
说明 |
| indicator-dots |
Boolean |
false |
是否显示面板指示点 |
| indicator-color |
Color |
rgba(0, 0, 0, .3) |
指示点颜色 |
| indicator-active-color |
Color |
#000000 |
当前选中指示点颜色 |
🔄 自动播放设置
| 属性 |
类型 |
默认值 |
说明 |
| autoplay |
Boolean |
false |
是否自动切换 |
| interval |
Number |
5000 |
自动切换时间间隔(ms) |
| circular |
Boolean |
false |
是否循环播放 |
🎯 滑动控制属性
| 属性 |
类型 |
默认值 |
说明 |
| current |
Number |
0 |
当前所在滑块的index |
| duration |
Number |
500 |
滑动动画时长(ms) |
| vertical |
Boolean |
false |
是否纵向滑动 |
| disable-touch |
Boolean |
false |
是否禁止用户触摸操作 |
👀 视觉布局特效
| 属性 |
类型 |
默认值 |
说明 |
平台限制 |
| previous-margin |
String |
0px |
前边距，露出前一项部分内容 |
部分平台不支持 |
| next-margin |
String |
0px |
后边距，露出后一项部分内容 |
部分平台不支持 |
| display-multiple-items |
Number |
1 |
同时显示的滑块数量 |
部分平台不支持 |
💡 高级功能属性
| 属性 |
类型 |
默认值 |
说明 |
平台 |
| acceleration |
Boolean |
false |
根据滑动速度连续滑动多屏 |
支付宝 |
| active-class |
String |
- |
swiper-item可见时的class |
支付宝 |
| changing-class |
String |
- |
滑动过程中的可见class |
支付宝 |
📢 事件监听处理
| 事件 |
触发时机 |
返回值 |
| @change |
current改变时 |
{current, source} |
| @transition |
位置改变时 |
{dx, dy} |
| @animationfinish |
动画结束时 |
{current, source} |
⚠️ 重要提醒
previous-margin、next-margin：app-nvue、抖音、飞书小程序不支持display-multiple-items：app-nvue、支付宝、小红书小程序不支持- 使用前请确认目标平台的兼容性！
💡 收藏本文，开发时随时查阅！如有疑问欢迎留言讨论～