swiper onchange
时间: 2024-02-11 21:02:02 浏览: 205
根据提供的引用内容,`swiper`组件的`onchange`事件是用来监听轮播图切换的事件。当轮播图切换时,可以通过该事件来执行相应的操作。
以下是一个示例代码,演示了如何使用`swiper`组件的`onchange`事件:
```html
<swiper indicator-dots="{{indicatorDots}}" autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}" bind:change="swiperChange">
<swiper-item>
<image src="image1.jpg"></image>
</swiper-item>
<swiper-item>
<image src="image2.jpg"></image>
</swiper-item>
<swiper-item>
<image src="image3.jpg"></image>
</swiper-item>
</swiper>
```
```javascript
Page({
data: {
indicatorDots: true,
autoplay: true,
interval: 5000,
duration: 1000
},
swiperChange: function(e) {
console.log("当前轮播图索引:" + e.detail.current);
}
})
```
在上述代码中,`swiper`组件的`bind:change`属性绑定了一个名为`swiperChange`的事件处理函数。当轮播图切换时,该函数会被触发,并且会将当前轮播图的索引作为参数传递给函数。在示例代码中,我们通过`console.log`打印出了当前轮播图的索引。
阅读全文