关于长列表swiper-item只显示3个如何优化?
<swiper @change=“changevideo”>
<block v-for='(item, key) in topSwipers' wx:key='key'>
<swiper-item v-if="(key >= (currentkey - 1)) && (key <= (currentkey + 1))" :style="{position: 'relative', height: '100%'}" :item-id="item.playerid" :data-xid="key">
<txv-video
[@touchstart](/user/touchstart)="touchStart"
[@touchend](/user/touchend)="touchEnd"
width="100%"
height="100%"
:vslideGestureInFullscreen="false"
object-fit="cover"
id="txtvideo"
style="margin-top: 10rem !important;width: 100%;height: 100%;"
:loop="true"
direction="0"
:vid="item.vid"
v-if="item.mode == 1 && item.playerid == ifplay && key == currentkey"
:playerid="item.playerid"
:controls="false"
objectFit="contain"
:autoplay="item.mode == 1 && item.playerid == ifplay"
:isHiddenStop="false"
>
</txv-video>
<txv-video
[@touchstart](/user/touchstart)="touchStart"
[@touchend](/user/touchend)="touchEnd"
width="100%"
height="100%"
:vslideGestureInFullscreen="false"
object-fit="cover"
id="txtvideo"
style="margin-top: 10rem !important;width: 100%;height: 100%;"
:loop="true"
direction="0"
:vid="item.vid"
v-if="(item.mode == 0 || item.mode == 2) && item.playerid == ifplay && key == currentkey"
:playerid="item.playerid"
:controls="false"
:autoplay="(item.mode == 0 || item.mode == 2) && item.playerid == ifplay"
:isHiddenStop="false"
>
</txv-video>
<div class="lanmu" v-if="item.playerid == ifplay">
<img class="avatar-img" :src="item.avatar" />
<view [@click](/user/click)="like(item.playerid, item)" style="height: 150rpx; padding-top: 20rpx;">
<img class="like-img" :src="liked ? '/static/images/like.png' : '/static/images/love.png'"/>
<span class="praise-txt">{{item.praise}}</span>
</view>
<!-- <img class="send-img" src="../../../static/images/send.png" />-->
<button class="share-btn" open-type="share" :data-rid="item.message"></button>
<!-- <span class="praise-txt">{{item.share}}</span>-->
</div>
<div class="bottomview" v-if="item.playerid == ifplay">
<span class="nicktxt">@{{item.nickname}}</span>
<span class="messagetxt">#{{item.message}}#</span>
</div>
</swiper-item>
</block>
</swiper>
没加
v-if="(key >= (currentkey - 1)) && (key <= (currentkey + 1))"
这个条件之前是可以滑动的,加这个的原因就是想要优化一下长列表swiper里面的item,让他每次只显示当前滑动的那一个和上下两个,目前问题是,加了这个条件之后,currentkey对应不上,只有0,1,2了,请问一下这个是什么问题,我应该如何优化这个组件呢?
3 回复