小程序swiper带切换按钮

本文介绍了小程序中Swiper组件的使用,包括设置同时显示的滑块数量、切换动画时间、监听滑动事件以及实现循环滑动等功能。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

小程序自带swiper组件,

display-multiple-items 同时显示的滑块数量
current: 当前所在滑块的 index
duration:切换需要花的时间 一般为1秒
bindchange:current发生改变触发
bindanimationfinish:动画结束时触发
circular 是否采用衔接滑动

      <view class="swiperCont">
        <view class="activeBtn1" bindtap="toLeft"></view>
        <view class="activeBtn2" bindtap="toRight"></view>

        <swiper current="{
    
    {currentIndex}}" circular="true" duration="1000" bindchange="changeIndex" bindanimationfinish="changeFinish" display-multiple-items="4">
          <swiper-item wx:for="{
    
    {[1, 2, 3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20]}}" wx:key="index" bindtap="openPop" data-type="choose" data-ind="index">
            <view 
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值