原网页地址：https://uniapp.dcloud.io/component/scroll-view
scroll-view，可滚动视图区域。用于区域滚动。
需注意在webview渲染页面中，区域滚动性能不及页面滚动。
属性说明
| 属性名 | 类型 | 默认值 | 说明 | 平台差异说明 |
| scroll-x | Boolean | false | 允许横向滚动 | |
| scroll-y | Boolean | false | 允许纵向滚动 | |
| upper-threshold | Number | 50 | 距顶部/左边多远时（单位px）,触发scrolltopper事件 | |
| lower-threshold | Number | 50 | 距离底部/右边多远时（单位px）,触发scrolltolwer事件 | |
| scroll-top | Number | 设置竖直滚动条位置 | ||
| scroll-top | Number | 设置横向滚动条位置 | ||
| scroll-into-view | String | 值应为某子元素id（id不能以数字开头）。设置哪个方向可滚动，则在哪个方向滚动到该元素 | ||
| scroll-with-animation | Boolean | false | 在设置滚动条位置时使用动画过渡 | |
| enable-back-to-top | Boolean | false | iOS点击顶部状态栏、安卓双击标题栏时，滚动条返回顶部，只支持竖向 | app-nvue，微信小程序 |
| show-scrollbar | Boolean | false | 控制是否出现滚动条 | App-nvue 2.1.5+ |
| refresher-enabled | Boolean | false | 开启自定义下拉刷新 | app-vue 2.5.12+,微信小程序基础库2.10.1+ |
| refresher-threshold | Number | 45 | 设置自定义下拉刷新阈值 | app-vue 2.5.12+,微信小程序基础库2.10.1+ |
| refresher-default-style | String | "black" | 设置自定义下拉刷新默认样式，支持设置 black，white，none，none 表示不使用默认样式 | app-vue 2.5.12+,微信小程序基础库2.10.1+ |
| refresher-background | String | "#FFF" | 设置自定义下拉刷新区域背景颜色 | app-vue 2.5.12+,微信小程序基础库2.10.1+ |
| refresher-triggered | Boolean | false | 设置当前下拉刷新状态，true 表示下拉刷新已经被触发，false 表示下拉刷新未被触发 | app-vue 2.5.12+,微信小程序基础库2.10.1+ |
| enable-flex | Boolean | false | 启用 flexbox 布局。开启后，当前节点声明了 display: flex 就会成为 flex container，并作用于其孩子节点。 | 微信小程序 2.7.3 |
| scroll-anchoring | Boolean | false | 开启 scroll anchoring 特性，即控制滚动位置不随内容变化而抖动，仅在 iOS 下生效，安卓下可参考 CSS overflow-anchor 属性。 | 微信小程序 2.8.2 |
| @scrolltoupper | EventHandle | 滚动到顶部/左边，会触发 scrolltoupper 事件 | ||
| @scrolltolower | EventHandle | 滚动到底部/右边，会触发 scrolltolower 事件 | ||
| @scroll | EventHandle | 滚动时触发，event.detail = {scrollLeft, scrollTop, scrollHeight, scrollWidth, deltaX, deltaY} | ||
| @refresherpulling | EventHandle | 自定义下拉刷新控件被下拉 | app-vue 2.5.12+,微信小程序基础库2.10.1+ | |
| @refresherrefresh | EventHandle | 自定义下拉刷新被触发 | app-vue 2.5.12+,微信小程序基础库2.10.1+ | |
| @refresherrestore | EventHandle | 自定义下拉刷新被复位 | app-vue 2.5.12+,微信小程序基础库2.10.1+ | |
| @refresherabort | EventHandle | 自定义下拉刷新被中止 | app-vue 2.5.12+,微信小程序基础库2.10.1+ |
使用数值滚动时，需要给<scroll-view>一个固定高度，通过css设置heigth;使用横向滚动时，需要给<scroll-view>添加white-space:nowrap；样式。
示例 查看演示
以下示例代码来自hello uni-app项目，推荐使用HBuilderX。
1 <!-- 本示例未包含完整css，获取外链css请参考上文，在hello uni-app项目中查看 --> 2 <template> 3 <view> 4 <view class="uni-padding-wrap uni-common-mt"> 5 <view class="uni-title uni-common-mt"> 6 Vertical Scroll 7 <text>\n纵向滚动</text> 8 </view> 9 <view> 10 <scroll-view :scroll-top="scrollTop" scroll-y="true" class="scroll-Y" @scrolltoupper="upper" @scrolltolower="lower" 11 @scroll="scroll"> 12 <view id="demo1" class="scroll-view-item uni-bg-red">A</view> 13 <view id="demo2" class="scroll-view-item uni-bg-green">B</view> 14 <view id="demo3" class="scroll-view-item uni-bg-blue">C</view> 15 </scroll-view> 16 </view> 17 <view @tap="goTop" class="uni-link uni-center uni-common-mt"> 18 点击这里返回顶部 19 </view> 20 <view class="uni-title uni-common-mt"> 21 Horizontal Scroll 22 <text>\n横向滚动</text> 23 </view> 24 <view> 25 <scroll-view class="scroll-view_H" scroll-x="true" @scroll="scroll" scroll-left="120"> 26 <view id="demo1" class="scroll-view-item_H uni-bg-red">A</view> 27 <view id="demo2" class="scroll-view-item_H uni-bg-green">B</view> 28 <view id="demo3" class="scroll-view-item_H uni-bg-blue">C</view> 29 </scroll-view> 30 </view> 31 </view> 32 </view> 33 </template>