本文精讲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、支付宝、小红书小程序不支持- 使用前请确认目标平台的兼容性！