更新时间：2024-08-22 09:46:19收藏订阅更新我的文档设置返回文档简介可滚动视图区域。scroll-view 滚动条可以全局禁用滚动，但是无法禁用 scroll-view 中的滚动距离展示。使用限制●使用竖向滚动时，需要指定固定高度，可通过 acss 设置 height。●在滚动 scroll-view 时会阻止页面回弹，所以在 scroll-view 中滚动，无法触发 onpulldownrefresh 下拉刷新功能。●scroll-view 不支持 scroll-x=true 和 scroll-y=true 同时生效，只能用一个。可以使用 view 设置 disable-scroll 为 true 禁止滑动。●scroll-view 满屏时，无法滑动页面，会导致导航栏滑动透明失效。可通过 my.setnavigationbar 设置导航栏样式：导航栏标题、导航栏背景色、导航栏底部边框颜色、导航栏左上角 logo 图片。●scroll-view 组件不支持自定义下拉刷新。●scroll-view 组件的滚动条默认隐藏，仅在滑动时展示。●scroll-view 组件在 ios 下不支持自定义修改，在 android 下允许通过 ::-webkit-scrollbar 自定义滚动条样式。扫码体验使用在线示例属性说明表格中 “-” 代表支持。属性类型描述webview 兼容性native 兼容性classstring外部样式名。--stylestring内联样式名。--scroll-xboolean允许横向滚动。 默认值： false--scroll-yboolean允许纵向滚动。 默认值： false--upper-thresholdnumber距顶部/左边多远时（单位 px），触发 scrolltoupper 事件。 默认值： 50--lower-thresholdnumber距底部/右边多远时（单位 px），触发 scrolltolower 事件。 默认值： 50--scroll-topnumber设置竖向滚动条位置。--scroll-leftnumber设置横向滚动条位置。--scroll-into-viewstring滚动到子元素，值应为某子元素的 id。当滚动到该元素时，元素顶部对齐滚动区域顶部。 说明：scroll-into-view 的优先级高于 scroll-top。-暂不支持scroll-with-animationboolean在设置滚动条位置时使用动画过渡。 默认值： false--scroll-animation-durationnumber当 scroll-with-animation设置为 true 时，可以设置 scroll-animation-duration 来控制动画的执行时间，单位 ms。基础库 1.9.0 -enable-back-to-topboolean当点击 ios 顶部状态栏或者双击 android 标题栏时，滚动条返回顶部，只支持竖向。 默认值： false基础库 1.11.0 -trap-scrollboolean纵向滚动时，当滚动到顶部或底部时，强制禁止触发页面滚动，仍然只触发 scroll-view 自身的滚动。 默认值： false基础库 1.11.2 -onscrolltouppereventhandle滚动到顶部/左边，会触发 scrolltoupper 事件。--onscrolltolowereventhandle滚动到底部/右边，会触发 scrolltolower事件。--onscrolleventhandle滚动时触发，event.detail = {scrollleft, scrolltop, scrollheight, scrollwidth}。--ontouchstarteventhandle触摸动作开始。基础库 1.15.0 -ontouchmoveeventhandle触摸后移动。基础库 1.15.0 -ontouchendeventhandle触摸动作结束。基础库 1.15.0 -ontouchcanceleventhandle触摸动作被打断，如来电提醒、弹窗。基础库 1.15.0 -disable-lower-scrollstring发生滚动前，对滚动方向进行判断，当方向是顶部/左边时，如果值为 always 将始终禁止滚动，如果值为 out-of-bounds 且当前已经滚动到顶部/左边，禁止滚动。基础库 2.6.2 -disable-upper-scrollstring发生滚动前，对滚动方向进行判断，当方向是底部/右边时，如果值为 always 将始终禁止滚动，如果值为 out-of-bounds 且当前已经滚动到底部/右边，禁止滚动。基础库 2.6.2 -faq为何 scroll-view 在 popup 扩展组件中无法滑动？popup 组件上加上 disablescroll={{false}} 属性才能滑动。为何使用 swiper 嵌套 scroll-view，scroll-view 无法滑动？swiper 和 scroll-view 均为滑动组件，如果必须使用，建议不做嵌套或者让 scroll-view 阻止 touch 事件冒泡即可：catchtouchstart、catchtouchmove。如何监听 scroll-view 滚动到底部？可以直接在 onscroll 方法中进行处理，使用 onscrolltolower 监听 scroll-view 的滚动高度来进行判断是否滑动到了底部。 scrollheight 是 scroll-view 里面所有 view 的高度和，scrolltop 是滚动的值； scrolltop 的值等于 scrollheight-scroll-view 视图的高度。为何在页面有蒙层的情况下，外层滑动到底部，会导致蒙层也能滑动？在外层 scroll-view 添加属性 trap-scroll。为什么 onscrolltoupper 和 onscrolltolower 事件同时被触发，且触发了多次？因为滚动时同时满足了距顶部 ${upper-threshold}px 内，距底部 ${lower-threshold}px 内，所以会同时触发 onscrolltoupper 和 onscrolltolower 事件。可以通过调整参数 upper-threshold 和 lower-threshold 避免一直处在触发区间来解决。相关文档●view 视图容器●my.setnavigationbar●popup 弹出菜单
