TanStack Table v8

用于为React、Solid、Vue、Svelte 和 TS/JS构建强大的表格和数据网格的Headless UI 。

> 寻找第 7 版 react-table？点击这里！

喜欢这些吗？

尝试其他一些TanStack ，例如React Query、React Form、React Charts

访问tanstack.com/table获取文档、指南、API 等！

您也可以通过我们的适配器名称了解 TanStack 表 ！

• React Table
• Solid Table
• Svelte Table
• Vue Table

概括

TanStack Table 是一个Headless表格库，这意味着它不附带组件、标记或样式。这意味着您可以完全控制标记和样式（CSS、CSS-in-JS、UI 组件库等），这也是它具有可移植性的原因。你甚至可以在 React Native 中使用它！

如果您想要一个 可以完全控制标记和实现的轻量级表格 ，那么您应该考虑使用 TanStack Table，一个无头表格库 。

如果您想要一个 现成的基于组件的表，它具有更多功能但对标记/样式/实现有更多限制 ，您应该考虑使用AG Grid，这是我们的 OSS 合作伙伴AG Grid提供的基于组件的表库。

TanStack Table 和 AG Grid 是  最好的表/数据网格库 。我们不是竞争，而是共同努力确保最高质量的表/数据网格选项可用于整个 JS/TS 生态系统和每个用例。

快速功能

• 不可知的核心 (JS/TS)
• 用于 React、Vue、Solid 的一级框架绑定
• ~14kb 或更少（使用 tree-shaking）
• 100% 打字稿（但不是必需的）
• Headless（100% 可定制，自带 UI）
• 自动开箱，选择加入可控状态
• 过滤器（列和全局）
• 排序（多列、多方向）
• 分组和聚合
• 旋转（即将推出！）
• 行选择
• 行扩展
• 列可见性/排序/固定/调整大小
• 表拆分
• 动画
• 可虚拟化
• 服务器端/外部数据模型支持

从 React Table v7 迁移

显着变化

• 完全重写 TypeScript
• 移除插件系统以支持更多的控制反转
• 更大和改进的 API
• 更好的受控状态管理
• 更好地支持服务器端操作
• 完整（但可选）数据管道控制
• 不可知核心
• 框架适配器

迁移

有相当多的重大变化（它们是值得的，相信我们！）：

• 事实证明，TypeScript 使您的代码 更好 /更安全，但通常也需要对架构进行重大更改。
• 插件系统已被删除，因此必须重写插件以包装/组合新的功能 API。如果您需要帮助，请联系我们！
• 列配置选项已更改，但仅略有更改。
• 表选项基本相同，围绕可选状态管理/控制和数据管道控制有一些较大的变化
• 虽然在精神上与 v7 相似，tableInstance但已重新配置为更快。

待办事项（按优先顺序）

• [X] 重写核心
  • [X] 核
  • [X] 列
  • [X] 标头
  • [X] 能见度
  • [X] 固定
  • [X] 过滤器
  • [X] 排序
  • [X] 分组
  • [X] 扩大
  • [X] 列大小
  • [X] 分页
  • [X] 行选择
• [ ] 迁移示例
  • [X] 列可见性
  • [X] 列排序
  • [X] 柱销
  • [X] 基本的
  • [X] 过滤器
  • [X] 排序
  • [X] 分页
  • [X] 分页控制
  • [X] 列大小
  • [X] 行选择
  • [X] 扩大
  • [X] 分组和聚合
  • [X] 可编辑数据
  • [ ] 厨房水槽
  • [X] 行-dnd
  • [ ] 流式行
  • [X] 子组件
  • [X] 虚拟行
  • [ ] 绝对布局
  • [ ] 块布局
  • [ ] 动画成帧运动
  • [X] 引导程序
  • [ ] 引导 UI 组件
  • [ ] 数据驱动的类和样式
  • [X] 全宽可调整大小的表格
  • [X] 全宽表
  • [ ] 材料-ui-组件
  • [ ] 材料 UI 增强表

安装

npm install @tanstack/react-table
npm install @tanstack/solid-table
npm install @tanstack/vue-table
npm install @tanstack/svelte-table

如何帮助？

• 试用已迁移的示例
• 在您自己的项目中尝试一下。
• 反省类型！即使没有完成文档，该库也会提供 100% 的打字稿来帮助您探索其功能。
• 阅读贡献指南
• 写一些文档！从API 文档开始，并尝试添加有关一项或多项功能的一些信息。这些类型在显示支持的内容和库的功能方面做得不错。
• 尝试将示例迁移到 v8！示例的待办事项列表在上面！
• 使用插件？ 尝试将您的插件（v8 不再具有插件系统）重写为在内部使用 TanStack Table 的功能包装器。新的 API 功能更强大且更易于编写。如果您发现无法弄清楚的内容，请告诉我们，我们会将其添加到 API 中。