WeChat小程序开发(画廊中实时监听当前页面并动态显示当前页面次序)
我的问题在于。最上方那个实时加载图片的次序怎么实现?不知道其他初学者有没有和我一样的困惑,所以我带着疑惑在网上浏览了很久,也许是我询问的方式有问题,也许是我的问题实在是太简单了,总之我一开始并没有搜索到满意的答案。于是只好开始自己的硬肝道路,我一开始的想法是用bintouchstart事件来改变上方的次序。后面又尝试加上bindtouchend组合来实现,但都不理想,要补的bug越来越多,后来搜了一下竟然可以用bindchange !,然后我就尝试了一下竟然非常成功!
<view class="content_No">{{picture_no}}/{{info[0].picture.length}}</view> <swiper bindchange="swiperChange" class="content_picture" style="height:{{swiperHeight}}" current="{{_index}}"> <block wx:for="{{info[0].picture}}" wx:key="{{index}}"> <swiper-item> <image data-id="{{index}}" mode="widthFix" class="content_image" src="{{info[0].picture[index]}}"></image> </swiper-item> </block> </swiper>
在swiper组件上加上事件bindchange,我们是通过改变变量picture_no来实现实时更新的,最后看js相应代码:
swiperChange:function(e){ console.log('bindChange_e',e) this.setData({ picture_no:JSON.parse(e.detail.current)+1 }) },
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步