scroll-view视图组件
0 Views H5 with
本文字数:267 字 | 阅读时长 ≈ 1 min

scroll-view视图组件

0 Views H5 with
本文字数:267 字 | 阅读时长 ≈ 1 min

本节主要讲述scroll-view视图组件

scroll-view可滚动视图区域允许视图区域内容横向滚动或者纵向滚动

属性 类型 默认值 说明
scroll-x Boolean false 允许横向滚动
scroll-y Boolean false 允许纵向滚动
upper-threshold Number 50 距顶部(左边)多远时,触发scrolltoupper
lower-top Number 50 距底部(右边)多远时,触发scrolltolower
scroll-top Number 竖向滚动条的位置
scroll-left Number 横向滚动条的位置
scroll-into-view String 值为某子元素的id,则滚动该元素,元素顶部对其滚动区域顶部
bindscrolltoupper EventHandle 滚动到顶部(左边),会触发scrolltoupper
bindscrolltolower EventHandle 滚动到底部(右边),会触发scrolltolower
bindscroll EventHandle 滚动时触发,event.datail={scrollLeft,scrollTop,scrollHeight,scrollWidth,deltaX,deltaY}
1
2
3
4
5
6
7
8
9
10
11
<scroll-view scroll-x="true" style="width:100%">
<view style="display:flex;flex-direction:row">
<view style="width:100px;margin-right:10px;">推荐</view>
<view style="width:100px;margin-right:10px;">推荐</view>
<view style="width:100px;margin-right:10px;">推荐</view>
<view style="width:100px;margin-right:10px;">推荐</view>
<view style="width:100px;margin-right:10px;">推荐</view>
<view style="width:100px;margin-right:10px;">推荐</view>
<view style="width:100px;margin-right:10px;">推荐</view>
</view>
</scroll-view>
May 06, 2018
H5
May 06, 2018
H5
May 06, 2018
H5
May 05, 2018
H5