uni--横向滑动

			<view class="content-box-scroll" v-show="btnList.length > 0">
				<scroll-view scroll-x style="white-space: nowrap;width: 100%;">
					<block v-for="(item, index) in btnList" :key="index">
						<view @tap="clickBtnChange(item,index)" class="btn-sty-yel-two" :class="[selectIndex===index ? 'select-bg' : 'no-select-bg']">
							<view class="btn-sty-yel-two-childern">
								{{item.name}}
							</view>
						</view>
					</block>
				</scroll-view>
			</view>

  

<scroll-view scroll-x style="white-space: nowrap;width: 100%;">
</scroll-view>
.content-box-scroll {
	height: 120rpx;
	display: flex;
	align-items: center;
}
.btn-sty-yel-two {
	display: inline-block; // 非常重要与 display: inline 相比,主要区别在于 display: inline-block 允许在元素上设置宽度和高度。用通俗的话讲,就是不独占一行的块级元素
	height: 60rpx;
	width: 200rpx;
	border-radius: 5rpx;
	margin-left: 10rpx;
	margin-right: 10rpx;
	.btn-sty-yel-two-childern {
		font-size: 30rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		height: 100%;
	}
}

  

上一篇:控制对文件的访问


下一篇:Python OpenCV模板识别并标注