首页 > 其他分享 >swiper

swiper

时间:2022-12-05 22:31:09浏览次数:39  
标签:console cur detail current 索引 data swiper

swiper

<--swiper要设置一个高度-->
<swiper :current="cur" @change="swiperChange" style="width: 100%,height: 150px;">
<-- swiper里面只能放swiper-item-->
<swiper-item>
<image src="/i/li/?n=2&i=images/blog/202212/01/aa68bc8984d19f74a210c5b00b1d1f7f.png?x-oss-process=image/format,webp/ignore-error,1"></image>
</swiper-item>
<swiper-item>
<image src="/i/li/?n=2&i=images/blog/202211/23/31cf4834d5a162c8c4589d8f68a63d03.png?x-oss-process=image/format,webp/ignore-error,1"></image>
</swiper-item>
<swiper-item>
<image src="/i/li/?n=2&i=images/blog/202212/02/a2fdc48b56c72f11a89dac0608ae5da4.jpg?x-oss-process=image/format,webp/ignore-error,1"></image>
</swiper-item>
</swiper>

data {
cur: 0,//默认为0
}

swiperChange(e) {
console.log(e.detail.current);//e.deatil.current为当前swiper-item的索引
this.cur = e.detail.current;//把索引赋值给cur使用
}

标签:console,cur,detail,current,索引,data,swiper
From: https://blog.51cto.com/u_15694202/5913320

相关文章