scroll-view为滚动视图，共有水平滚动和垂直滚动两种
使用竖向滚动时，需要给<scroll-view/>一个固定高度，通过 WXSS 设置 height。
index.wxss 是页面的结构文件：
<!--垂直滚动-->
<view class="section">
<view class="section__title">vertical scroll</view><scroll-view scroll-y="true" style="height: 150px;" bindscrolltoupper="upper" bindscrolltolower="lower" bindscroll="scroll" scroll-into-view="{{toView}}" scroll-top="{{scrollTop}}"><view class="scroll-view-item ">西瓜</view><view class="scroll-view-item ">橘子</view><view class="scroll-view-item ">苹果</view><view class="scroll-view-item ">香蕉</view> <view class="scroll-view-item ">葡萄</view><view class="scroll-view-item ">柚子</view><view class="scroll-view-item ">火龙果</view><view class="scroll-view-item ">哈密瓜</view></scroll-view>
</view>
<!--水平滚动-->
<view class="section scroll_x">
<view class="section__title">horizontal scroll</view><scroll-view scroll-x="true" style=" white-space: nowrap; display: flex"><view class="scroll-view-item ">西瓜</view><view class="scroll-view-item ">橘子</view><view class="scroll-view-item ">苹果</view><view class="scroll-view-item ">香蕉</view> <view class="scroll-view-item ">葡萄</view><view class="scroll-view-item ">柚子</view><view class="scroll-view-item ">火龙果</view><view class="scroll-view-item ">哈密瓜</view></scroll-view>
</view>
以下是页面效果：
