uniapp 左右滑动卡片

传输门

html

<view>
		<scroll-view class="uni-swiper" scroll-x>
			<view class="scrollx">
				<view class="title">滑动一</view>
			</view>
			<view class="scrollx">
				<view class="title">滑动二</view>
			</view>
			<view class="scrollx">
				<view class="title">滑动三</view>
			</view>
			<view class="scrollx">
				<view class="title">滑动四</view>
			</view>
		</scroll-view>
	</view>

css

<style>
	/* 左右滑动 */
	.uni-swiper {
    
    
		white-space: nowrap;
	}

	.scrollx {
    
    
		padding: 30rpx 20rpx;
		text-align: center;
		display: inline-block;
		width: 210rpx;
		border: 1rpx solid #ccc;
	}
</style>

如果想去除滚动条

在 App.vue 内设置，两种都可去除滚动条

<style>
	::-webkit-scrollbar {
    
    
		display: none;
	}

	uni-scroll-view .uni-scroll-view::-webkit-scrollbar {
    
    
		display: none
	}
</style>

原文