<swiper class="swiper" :display-multiple-items="multipleItems">
<swiper-item v-for="(item,index) in vipList" :key="index" :item-id="">
<view class="vip-card-mini" @click="changeVip(index, item)":style="{'margin-right':index== -1?'20rpx':'0','border':index === selectedIndex?'1px solid #cfa16c':'none','min-width':greaterThan?'28%':'30%'}">
<view class="flex-between">
<view style="color:#7d5723 ;font-size: 12px;font-weight: 600;">{{}}</view>
<view style="color: #905723;font-size: 10px;margin-right: 8rpx;text-align: right;">Normal VIP
</view>
</view>
<view class="flex-between-center">
<view class="amount">￥{{}}</view>
<view class="vip-img"><image src="/static/" style="width: 20px;height: 20px;"></image></view></view>
</view>
</swiper-item>
<view v-if="multipleItems==3">
// Must write it or you will get an error
<swiper-item v-if="<multipleItems"></swiper-item>
<swiper-item v-if="<multipleItems-1"></swiper-item>
</view>
</swiper>
<script>
export default {
data() {
return {
// vipList array length Because this function requires displaying three cards. If multipleItems console <swiper-item> quantity related error information is not dynamically written, the number of multipleItems console <swiper-item> is related to the error information related to the number of errors in the
multipleItems:3,
}
}
}
</script>