Uniapp：scroll-view(区域滑动视图)

---

一、基本概述

scroll-view，可滚动视图区域。用于区域滚动。

二、属性说明

属性名	类型	默认值	说明	平台差异说明
scroll-x	Boolean	false	允许横向滚动
scroll-y	Boolean	false	允许纵向滚动

三、基本使用

3.1 纵向滚动

<scroll-view scroll-y class="scroll-Y">
  <view id="demo1" class="scroll-view-item uni-bg-red">Aview>
  <view id="demo2" class="scroll-view-item uni-bg-green">Bview>
  <view id="demo3" class="scroll-view-item uni-bg-blue">Cview>
scroll-view>

.scroll-Y {
  height: 300rpx;
}
.scroll-view-item {
  height: 300rpx;
  line-height: 300rpx;
  text-align: center;
  font-size: 36rpx;
}

3.2 横向滚动

<scroll-view class="scroll-view_H" scroll-x>
  <view id="demo1" class="scroll-view-item_H uni-bg-red">Aview>
  <view id="demo2" class="scroll-view-item_H uni-bg-green">Bview>
  <view id="demo3" class="scroll-view-item_H uni-bg-blue">Cview>
scroll-view>

.scroll-view_H {
  white-space: nowrap;
  width: 100%;
}
.scroll-view-item_H {
	display: inline-block;
	width: 100%;
	height: 300rpx;
	line-height: 300rpx;
	text-align: center;
	font-size: 36rpx;
}