---
url: /components/table-page.md
---
# TablePage 表格页

CRUD 列表页的整页封装：页头（标题 / 描述 / 动作）、查询区、工具栏、表格 + 分页四区一体，内部由 `request` 数据代理驱动——翻页、查询、重置、远程排序与筛选全自动联动，开箱即得「撑满剩余空间、表格内部滚动」的中后台页面骨架。

## 基础用法

传 `request`（返回 `{ list, total }`）+ `fields`（查询字段）+ `columns` 即可成一个完整列表页：查询区自带查询 / 重置按钮（回车触发），翻页自动携带 `page / pageSize` 重查，筛选条件合并进请求参数并回第 1 页。

## 远程排序与筛选

`remote-sort`（默认开）把列排序写入请求参数（`sort-prop-key / sort-order-key`，默认 `sortProp / sortOrder`，值为 `asc / desc`），以当前页重查；`remote-filter` 把列筛选收敛为 `filters` 参数并回第 1 页。关闭时回落表格内建的客户端排序与过滤。

## 撑满剩余空间

`fit` 默认开：整页撑满 flex 父容器的剩余高度，表格区自动量高、内部滚动，工具栏与分页常驻可视区——列表再长也不整页滚。父链保持 flex column 或给定确定高度即可。

`EbDataTable` 也单独提供 `fit`：给已有页面里的数据表格单独开启同样的高度自适应。

## Methods

通过模板 ref 调用；`refresh` 用于增删改后以当前参数重查，`search / reset` 与查询区按钮同一入口。