微信小程序--swiper轮播图出现抖动问题
问题:在手机上,swiper的item一直在抖动,不滚动了。
官方:
解决方案:(参考别人的文章,放在离自己的项目代码里)
wxml
<view class="swiperBox" style="{{defaultData.indicatorColors}}"> <swiper class="slide-swiper" style="height:{{defaultData.bannerheight}}rpx;" indicator-dots="{{false}}" autoplay="{{true}}" interval="{{interval}}" duration="{{duration}}" indicator-color="{{defaultData.indicatorColor}}" indicator-active-color="{{defaultData.indicatorActiveColor}}" current="{{currentSwiper}}" bindchange="swiperChange" > <block wx:for="{{defaultData.src}}" wx:key="s_id"> <swiper-item data-item="{{item}}"> <view class=" swiper-item"> <image class="swiper-item-img" src="{{item.imgUrl}}" mode="widthFix" /> </view> </swiper-item> </block> </swiper> <view class="dots {{defaultData.dotsType}}"> <block wx:for="{{defaultData.src}}" wx:key="src"> <view class="dot{{index == currentSwiper ? ' active' : ''}}" /> </block> </view> </view>
js
methods: {
swiperChange: function (e) {
let { current, source } = e.detail
if (source === 'autoplay' || source === 'touch') {
this.setData({
currentSwiper: current
})
}
},
}
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 25岁的心里话
· 闲置电脑爆改个人服务器(超详细) #公网映射 #Vmware虚拟网络编辑器
· 零经验选手,Compose 一天开发一款小游戏!
· 通过 API 将Deepseek响应流式内容输出到前端
· AI Agent开发,如何调用三方的API Function,是通过提示词来发起调用的吗