V1.0.0
Skip to content

WScrollbar 滚动条组件

滚动条组件,基于 WinDesignNext Scrollbar 封装,为固定高度区域提供自定义滚动条,常用于长列表、消息流等场景。

基础用法

API

属性类型默认值说明
componentstringWScrollbar组件类型(必填)
heightstring | number | DataBindingValue滚动区域高度
maxHeightstring | number | DataBindingValue最大高度
nativebooleanfalse使用原生滚动条
alwaysbooleanfalse滚动条始终显示
noresizebooleanfalse禁用 resize 监听
minSizenumber20滚动条最小尺寸
distancenumber0触发 end-reached 的距离阈值
tagstringdiv视图容器标签
wrapClassstring外层包裹类名
viewClassstring视图区域类名
scrollbarSizenumber6垂直滚动条宽度
hScrollbarSizenumber6水平滚动条高度
actionobject滚动事件配置
childrenstring[]可滚动内容子组件 ID

事件

事件type说明
滚动scroll滚动时触发
到达边缘end-reached滚动到顶部/底部/左/右边缘时触发
json
{
  "action": {
    "event": {
      "name": "onScrollEnd",
      "type": "end-reached"
    }
  }
}

path 支持说明

属性path 支持说明
height动态设置滚动区域高度
maxHeight动态设置最大高度

动态高度

json
{
  "component": "WScrollbar",
  "maxHeight": { "path": "/panelMaxHeight" },
  "children": ["content_list"]
}

使用场景

场景推荐配置
固定高度列表maxHeight: 200 + children 引用 WList
消息流always: true + end-reached 加载更多
弹窗内滚动height path 绑定 + native: false

注意事项

  • 必须设置 heightmaxHeight 之一,否则内容不会滚动
  • wrapStyle / viewStyle 等对象型样式暂不支持 path,请使用静态配置
  • 子组件通过 children 引用,与 WCard、WRow 等容器组件用法一致