微信小程序-uniapp使用＜scroll-view ＞组件实现卡片左滑功能在电脑端小程序版不生效问题

<scroll-view class="scroll-view_H" :scroll-x="greaterThan" @scroll="scroll" scroll-left="120">
	<view id="demo1" class="scroll-view-item_H" v-for="(item,index) in vipList" :key="index">
		<view class="flex-between">
			<text style="color:#7d5723 ;font-size: 8px;font-weight: 600;">{{item.name}}</text><text class="car-type">{{item.type}}</text>
		</view>
		<view class="flex-between-center">
		<view>￥{{item.amount}}</view>
		<view style="margin-right: 14rpx;margin-top: 12rpx;">
			<image src="../../../static/vip.png" style="width: 20px;height: 20px;"></image>
		</view>
		</view>
	</view>
</scroll-view>

改用swiper组件就可以啦~附上参考代码

<swiper class="swiper" :display-multiple-items="multipleItems">
	<swiper-item v-for="(item,index) in vipList" :key="index" :item-id="item.id">
		<view class="vip-card-mini" @click="changeVip(index, item)":style="{'margin-right':index== vipList.length-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;">{{item.name}}</view>
					<view style="color: #905723;font-size: 10px;margin-right: 8rpx;text-align: right;">普通VIP
					</view>
			</view>
			<view class="flex-between-center">
					<view class="amount">￥{{item.amount}}</view>
					<view class="vip-img"><image src="/static/vip.png" style="width: 20px;height: 20px;"></image></view></view>
			</view>
	</swiper-item>
	<view v-if="multipleItems==3">
         //必写 不然会报错
	    <swiper-item v-if="vipList.length<multipleItems"></swiper-item>
	    <swiper-item v-if="vipList.length<multipleItems-1"></swiper-item>
	</view>
</swiper>
<script>
export default {
		data() {
			return {
                // vipList数组长度 因为这个功能需求是要展示三个卡片 如果不动态写multipleItems控制台<swiper-item>数量相关错误信息
                multipleItems:3,
            }
        }
}
</script>