PagedTable 分页表格
PagedList组件和DataTable组件的高阶封装,集成两组件功能,可用于生成通用分页表格。
基础用法
需要传入columns
来生成表格列,需要传入data
来显示数据和分页组件,需要传入get-paged-data
回调函数来响应组件内数据变化。
复杂功能
本例模拟了常见场景下的列表页面的基础要素,包括搜索条件,分页,单一条件排序(后端排序)
使用提示
组件透传了对应参数以及事件绑定给`PagedList`组件和`DataTable`组件Attributes
参数 | 类型 | 说明 | 可选值 | 默认值 |
---|---|---|---|---|
data-table-props | object | DataTable 组件绑定参数。可选传参方式 | -- | -- |
data-table-events | object | DataTable 组件绑定事件对象 | -- | -- |
init-sort | object | 远程排序数据的初始值。格式为{orderby: 'id',order: 'desc'} | -- | -- |
└ orderby | string | 排序字段 | -- | -- |
└ order | string | 排序规则 | desc/asc | -- |
sort-prop-keys | object | params数据中排序参数的键名,仅控制params对象中的键名,设置初始值时仍为orderby 和order | -- | -- |
└ orderby | string | params中排序字段键名 | -- | orderby |
└ order | string | params中排序规则键名 | -- | order |
Events
组件透传绑定事件给PagedList
组件和DataTable
组件,可直接在组件上监听对应组件事件。
Methods
组件代理了PagedList
组件和DataTable
组件(包括Table
组件)提供的所有方法,可以直接在组件实例上调用。