我用滑块视图组件写了一个自定义轮播图,有几行代码不是很理解,求分析?
发布于 5 年前 作者 laiyong 11760 次浏览 来自 官方Issues

问题点1:js文件中,for循环控制条件是“item = sliederList[i];”,按说这里应该是和i有关的,比如“i<5”,这样写for循环什么时候结束呢

问题2:js文件中,sliderList一共三个item,切换时三个selected的切换状态应该是“true false false”,“false,true false”,“false false true”,但是“item.selected = e.detail.current == i;”怎么改变selected的看不懂

Page({
 
 
  data: {
    sliderList : [
        {selected:true,  imageSource:'./image/banner1.jpg'},
        {selected:false, imageSource:'./image/banner2.jpg'},
        {selected:false, imageSource:'./image/banner3.jpg'}
    ]
  },
  //修改指示点选中态
  switchTab : function(e) {
     var sliederList = this.data.sliderList,i, item;
     for(i = 0;item = sliederList[i];++i){
       item.selected = e.detail.current == i;
     
     this.setData({
       sliderList:sliederList
     });
  }

});




<view class="customSwiper">
    <swiper class="banner" autoplay="true" interval="2000" duration="300" bindchange="switchTab">
        <block wx:for="{{sliderList}}">
            <swiper-item>
                <image style="width:100%;height:100%" src="{{item.imageSource}}"/>
            </swiper-item>
        </block>
    </swiper>
 
    <view class="tab">
        <block wx:for="{{sliderList}}">
           <view wx:if="{{item.selected}}" class="tab-item.selected">{{index+1}}</view>
           <view wx:else class="tab-item">{{index+1}}</view>
        </block>
    </view>
 
</view>
3 回复

贴代码片段是最好的解决方法

<swiper-item>标签好像写错了

item.selected = e.detail.current == i 看不懂?自己测试:

let a=2

item.selected = a == 1

回到顶部