小程序既能禁止swiper手动滑动不影响页面向上滑动又能点击swiper里面的按钮的方法

手动禁止了,也能向上滑了,可是里面的bindtap事件触发不到了,有什么办法能解决呢

<view class="shades">
  <view class="shade"></view>
  <swiper class="swiper_tuan" autoplay="true" vertical="{{true}}" interval="{{3000}}" duration="{{200}}">
    <block wx:for="{{group_order}}" wx:key="group_order">
      <swiper-item class="swiper_tuan_num">
        <view class="group">
          <view class='group_user'>
            <image class="head_img" src="{{item.avatar}}"></image>
            <text class="head_name">{{item.alias}}</text>
          </view>
          <view class='surplus'>
            <view class="surplus_text">还差
              <text>{{item.cha_num}}人</text>拼成</view>
            <view class="shengyu">剩余{{item.end_time}}</view>
          </view>
          <view class="join_group" data-groupid="{{item.id}}" catchtap='tapBuyNow' id="1">去参团</view>
        </view>
      </swiper-item>
    </block>
  </swiper>
</view>

.shades{
position: relative;
background: #fff;
}
.shade{
position: absolute;
background: transparent;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 5
}

阅读 8.4k
2 个回答

swiper-item 组件添加 catchtouchmove 事件, 禁止滑动swiperItem 进行切换。 切换swiperItem 可以通过setData currentIndex

 <swiper autoplay="{{false}}" current="{{currentIndex}}">
        <swiper-item catchtouchmove="catchTouchMove"> 
            <view></view>
        </swiper-item>
 </swiper>

=========== js ============
catchTouchMove: function (e) {
    return !1;
}

点击遮罩时,获取当前轮播的index,写跳转

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题