微信小程序怎样修改swiper组件中样式的修改

发布网友发布时间：2022-04-22 09:56

共1个回答

热心网友时间：2022-04-19 05:54

学小程序时写过一个B站demo，也遇到此问题，最后自定义Swiper的Dot来实现了。
思路是：用view组件重写dot，给swiper组件绑定bindchange事件用来获取当前第几个dot，动态改变class。


<view class="slider-wrapper">
<swiper bindchange="swiperChange" indicator-dots="{{indicatorDots}}"
autoplay="{{autoplay}}" interval="{{interval}}" ration="{{ration}}">
<block wx:for="{{imgUrls}}" wx:key="*this">
<swiper-item>
<image src="{{item}}" class="slide-image"/>
</swiper-item>
</block>
</swiper>
<view class="swipe-btn-wrapper">
<view class="swipe-btn-list">
<view class="{{dotsClass[0]}}"></view>
<view class="{{dotsClass[1]}}"></view>
<view class="{{dotsClass[2]}}"></vi