V1.0.0
Skip to content

WPagination 分页组件

分页组件,基于 WinDesignNext Pagination 封装,用于数据列表分页,modelValue 绑定当前页码,pageSizetotal 等支持 path 数据绑定。

基础用法

API

属性类型默认值说明
componentstringWPagination组件类型(必填)
modelValueDataBindingValue当前页码绑定
pageSizeDataBindingValue10每页条数
totalDataBindingValue总条数
pageCountDataBindingValue总页数(与 total 二选一)
pageSizesDataBindingValue每页条数选项
layoutstring布局,如 total, sizes, prev, pager, next
backgroundbooleantrue是否显示背景色
smallbooleanfalse小型分页
disabledbooleanfalse是否禁用
hideOnSinglePagebooleanfalse仅一页时隐藏
actionobject分页变化事件配置

事件

事件type说明
页码/条数变化change页码或每页条数变化时触发(默认)
页码变化current-change仅当前页变化
条数变化size-change仅每页条数变化
json
{
  "action": {
    "event": {
      "name": "onPageChange",
      "type": "change",
      "context": [
        { "key": "page", "value": { "path": "/currentPage" } },
        { "key": "pageSize", "value": { "path": "/pageSize" } }
      ]
    }
  }
}

path 支持说明

属性path 支持说明
modelValue当前页码双向绑定
pageSize每页条数
total总条数
pageCount总页数
pageSizes每页条数选项(literalArray 或 path)

Agent 更新分页状态

json
{
  "version": "v0.9",
  "updateDataModel": {
    "surfaceId": "main",
    "path": "/",
    "value": { "currentPage": 2, "pageSize": 20, "total": 256 }
  }
}

使用场景

场景推荐配置
表格分页modelValue + pageSize + total + change 事件
Agent 翻页action 携带 /currentPage context,Agent 更新 dataModel
精简布局layout: "prev, pager, next"

注意事项

  • modelValuecurrentPage 等效,优先使用 modelValue
  • totalpageCount 二选一即可
  • 默认 change 事件在页码或每页条数变化时都会触发