支付宝小程序组件 滑块视图容器·Swiper
支付宝小程序滑块视图容器。
[TOC]
API
| 属性名 | 类型 | 默认值 | 描述 |
|---|---|---|---|
| indicator-dots | Boolean | false | 是否显示指示点 |
| indicator-color | Color | rgba(0, 0, 0, .3) | 指示点颜色 |
| indicator-active-color | Color | #000 | 当前选中的指示点颜色 |
| autoplay | Boolean | false | 是否自动切换 |
| current | Number | 0 | 当前页面的 index |
| duration | Number | 500 | 滑动动画时长 |
| interval | Number | 5000 | 自动切换时间间隔 |
| circular | Boolean | false | 是否启用无限滑动 |
| onChange | Function | 否 | current 改变时会触发，event.detail = {current: current} |
swiper-item
仅可放置在组件中，宽高自动设置为100%。
Sceenshot
示例代码：
interval Page({
data: {
background: ['green', 'red', 'yellow'],
indicatorDots: true,
autoplay: false,
interval: 3000,
},
changeIndicatorDots(e) {
this.setData({
indicatorDots: !this.data.indicatorDots
})
},
changeAutoplay(e) {
this.setData({
autoplay: !this.data.autoplay
})
},
intervalChange(e) {
this.setData({
interval: e.detail.value
})
},
})