<template>
<view>
<swiper @change="changeList" :vertical="true" style="height: 500rpx;">
<swiper-item v-for="(item,index) in showList" :key="index">
<view
style="background-color: aqua;width: 100%;height: 500rpx;align-items: center;justify-content: center;">
{{item.videoId}}
</view>
</swiper-item>
</swiper>
</view>
</template>
<script>
export default {
data() {
return {
showList: [{
"videoId": 2
},
{
"videoId": 3
},
{
"videoId": 4
}
],
videoList: [{
"videoId": 2
},
{
"videoId": 3
},
{
"videoId": 4
},
{
"videoId": 5
},
{
"videoId": 6
},
{
"videoId": 7
},
{
"videoId": 8
},
{
"videoId": 9
},
{
"videoId": 10
},
{
"videoId": 11
},
{
"videoId": 12
}
],
}
},
methods: {
changeList(event) {
console.log(event);
const currentIndex = event.detail.current
console.log(currentIndex);
if (currentIndex == this.showList.length - 1) {
const nextId = this.showList[this.showList.length - 1].videoId + 1;
const nextItem = this.videoList.find(item => item.videoId == nextId);
if (nextItem) {
this.showList.push(nextItem);
}
}
}
}
}
</script>
<style>
</style>
qjr (作者)
我看你们在4.31版本修复:App平台 修复 swiper-item个数动态减少后渲染和交互异常的Bug;这个会不会一样有影响?
2024-11-21 09:13