@sfc-components/scroll-view

scroll-view component for Rax.

Usage no npm install needed!

<script type="module">
  import sfcComponentsScrollView from 'https://cdn.skypack.dev/@sfc-components/scroll-view';
</script>

README

a-scroll-view

属性名 类型 默认值 描述
class String 外部样式名
style String 内联样式名
scroll-x Boolean false 允许横向滚动
scroll-y Boolean false 允许纵向滚动
upper-threshold Number 50 距顶部/左边多远时(单位px),触发 scrolltoupper 事件
lower-threshold Number 50 距底部/右边多远时(单位px),触发 scrolltolower 事件
scroll-top Number 设置竖向滚动条位置
scroll-left Number 设置横向滚动条位置
scroll-into-view String 值应为某子元素id,则滚动到该元素,元素顶部对齐滚动区域顶部
scroll-with-animation Boolean false 在设置滚动条位置时使用动画过渡
onScrollToUpper EventHandle 滚动到顶部/左边,会触发 scrolltoupper 事件
onScrollToLower EventHandle 滚动到底部/右边,会触发 scrolltolower 事件
onScroll EventHandle 滚动时触发,event.detail = {scrollLeft, scrollTop, scrollHeight, scrollWidth