TanStack Table

TanStack Table

无头数据表格引擎

开发官网

应用介绍

写后台列表页的人都卡过同一个两难:用现成的表格组件,功能是齐了,可样式改不动,设计稿一改就得跟组件库较劲;自己从头写,排序、过滤、分组、聚合、行选择几套状态搅在一起,最后写成谁都不敢碰的一坨。TanStack Table 的思路是干脆不提供 UI:它只负责状态和逻辑,不碰 DOM 和样式,你拿它算好的结果自己渲染,想配哪套设计系统都行。

核心与框架无关,React、Vue、Svelte、Solid、Angular、Lit、Preact、Alpine 都有官方绑定,以后换框架,表格逻辑不用重写。数据量大时可以配合 TanStack Virtual 做虚拟滚动,服务端分页、排序、过滤从设计之初就考虑在内。GitHub 上 2.8 万 star,前端做数据表格几乎绕不开它。

软件功能



无头设计:只提供状态、API 和计算结果,标签结构和样式完全由你决定,可以套进任何组件库或设计系统。

完整的表格能力:排序、筛选、分面、分组、聚合、分页、行展开、行与单元格选择、单元格合并,一应俱全。

列控制:列固定、列排序、列显隐和列宽拖拽调整都有现成状态可用。

多框架绑定:同一套核心逻辑适配 React、Vue、Svelte、Solid、Angular、Lit、Preact、Alpine 等框架。

服务端数据:分页、排序、过滤都可切换为手动模式,交给后端处理,适合大数据量列表。

大数据渲染:搭配 TanStack Virtual 实现虚拟化,上万行也能流畅滚动。

类型安全:用 TypeScript 编写,列定义和数据类型全程有提示。