TanStackTable v8
自动
框架
版本
菜单
快速开始
核心指南
功能指南
核心 API
功能 API
企业版
示例

表头 API

这些是所有表头的**核心**选项和 API 属性。更多选项和 API 属性可能适用于其他表格功能。

表头 API

所有表头对象都具有以下属性

id
tsx
id: string

id: string

表头的唯一标识符。

索引
tsx
index: number

index: number

表头在表头组中的索引。

深度
tsx
depth: number

depth: number

表头的深度，从零开始索引。

列
tsx
column: Column<TData>

column: Column<TData>

表头关联的 Column 对象

表头组
tsx
headerGroup: HeaderGroup<TData>

headerGroup: HeaderGroup<TData>

表头关联的 HeaderGroup 对象

子表头
tsx
type subHeaders = Header<TData>[]

type subHeaders = Header<TData>[]

表头的层级子表头。如果表头关联的列是叶子列，则为空。

colSpan
tsx
colSpan: number

colSpan: number

表头的 col-span。

rowSpan
tsx
rowSpan: number

rowSpan: number

表头的 row-span。

getLeafHeaders
tsx
type getLeafHeaders = () => Header<TData>[]

type getLeafHeaders = () => Header<TData>[]

返回此表头下层级嵌套的叶子表头。

isPlaceholder
tsx
isPlaceholder: boolean

isPlaceholder: boolean

一个布尔值，表示表头是否为占位符表头

placeholderId
tsx
placeholderId?: string

placeholderId?: string

如果表头是占位符表头，这将是一个唯一的表头 ID，与表格中任何其他表头都不冲突

getContext
tsx
getContext: () => {
  table: Table<TData>
  header: Header<TData, TValue>
  column: Column<TData, TValue>
}

getContext: () => {
  table: Table<TData>
  header: Header<TData, TValue>
  column: Column<TData, TValue>
}

返回基于列的组件（如表头、表尾和筛选器）的渲染上下文（或 props）。使用这些 props 和框架的 flexRender 实用程序，使用您选择的模板渲染它们

tsx
flexRender(header.column.columnDef.header, header.getContext())

flexRender(header.column.columnDef.header, header.getContext())

表格 API

getHeaderGroups

tsx
type getHeaderGroups = () => HeaderGroup<TData>[]

type getHeaderGroups = () => HeaderGroup<TData>[]

返回表格的所有表头组。

getLeftHeaderGroups
tsx
type getLeftHeaderGroups = () => HeaderGroup<TData>[]

type getLeftHeaderGroups = () => HeaderGroup<TData>[]

如果固定列，则返回左侧固定列的表头组。

getCenterHeaderGroups
tsx
type getCenterHeaderGroups = () => HeaderGroup<TData>[]

type getCenterHeaderGroups = () => HeaderGroup<TData>[]

如果固定列，则返回未固定列的表头组。

getRightHeaderGroups
tsx
type getRightHeaderGroups = () => HeaderGroup<TData>[]

type getRightHeaderGroups = () => HeaderGroup<TData>[]

如果固定列，则返回右侧固定列的表头组。

getFooterGroups
tsx
type getFooterGroups = () => HeaderGroup<TData>[]

type getFooterGroups = () => HeaderGroup<TData>[]

返回表格的所有表尾组。

getLeftFooterGroups
tsx
type getLeftFooterGroups = () => HeaderGroup<TData>[]

type getLeftFooterGroups = () => HeaderGroup<TData>[]

如果固定列，则返回左侧固定列的表尾组。

getCenterFooterGroups
tsx
type getCenterFooterGroups = () => HeaderGroup<TData>[]

type getCenterFooterGroups = () => HeaderGroup<TData>[]

如果固定列，则返回未固定列的表尾组。

getRightFooterGroups
tsx
type getRightFooterGroups = () => HeaderGroup<TData>[]

type getRightFooterGroups = () => HeaderGroup<TData>[]

如果固定列，则返回右侧固定列的表尾组。

getFlatHeaders
tsx
type getFlatHeaders = () => Header<TData, unknown>[]

type getFlatHeaders = () => Header<TData, unknown>[]

返回表格中所有列的表头，包括父表头。

getLeftFlatHeaders
tsx
type getLeftFlatHeaders = () => Header<TData, unknown>[]

type getLeftFlatHeaders = () => Header<TData, unknown>[]

如果固定列，则返回表格中所有左侧固定列的表头，包括父表头。

getCenterFlatHeaders
tsx
type getCenterFlatHeaders = () => Header<TData, unknown>[]

type getCenterFlatHeaders = () => Header<TData, unknown>[]

如果固定列，则返回所有未固定列的表头，包括父表头。

getRightFlatHeaders
tsx
type getRightFlatHeaders = () => Header<TData, unknown>[]

type getRightFlatHeaders = () => Header<TData, unknown>[]

如果固定列，则返回表格中所有右侧固定列的表头，包括父表头。

getLeafHeaders
tsx
type getLeafHeaders = () => Header<TData, unknown>[]

type getLeafHeaders = () => Header<TData, unknown>[]

返回表格中所有叶子列的表头（不包括父表头）。

getLeftLeafHeaders
tsx
type getLeftLeafHeaders = () => Header<TData, unknown>[]

type getLeftLeafHeaders = () => Header<TData, unknown>[]

如果固定列，则返回表格中所有左侧固定叶子列的表头（不包括父表头）。

getCenterLeafHeaders
tsx
type getCenterLeafHeaders = () => Header<TData, unknown>[]

type getCenterLeafHeaders = () => Header<TData, unknown>[]

如果固定列，则返回所有未固定列的表头（不包括父表头）。

getRightLeafHeaders
tsx
type getRightLeafHeaders = () => Header<TData, unknown>[]

type getRightLeafHeaders = () => Header<TData, unknown>[]

如果固定列，则返回表格中所有右侧固定叶子列的表头（不包括父表头）。

在 GitHub 上编辑
表头组
行
订阅 Bytes

您每周的 JavaScript 新闻。每周一免费发送给超过 10 万名开发者。

Bytes

无垃圾邮件。随时取消订阅。