分页 API | TanStack Table Docs

状态

分页状态使用以下结构存储在表格中：

tsx

export type PaginationState = {
  pageIndex: number
  pageSize: number
}

export type PaginationTableState = {
  pagination: PaginationState
}

export type PaginationInitialTableState = {
  pagination?: Partial<PaginationState>
}

export type PaginationState = {
  pageIndex: number
  pageSize: number
}

export type PaginationTableState = {
  pagination: PaginationState
}

export type PaginationInitialTableState = {
  pagination?: Partial<PaginationState>
}

表格选项

manualPagination

tsx

manualPagination?: boolean

manualPagination?: boolean

启用手动分页。如果此选项设置为 true，表格将不会使用 getPaginationRowModel() 自动对行进行分页，而是希望您在将行传递给表格之前手动对行进行分页。如果您正在进行服务器端分页和聚合，这很有用。

pageCount

tsx

pageCount?: number

pageCount?: number

手动控制分页时，如果知道总页数，可以向表格提供 pageCount 值。如果不知道有多少页，可以将其设置为 -1。或者，您可以提供 rowCount 值，表格将内部计算 pageCount。

rowCount

tsx

rowCount?: number

rowCount?: number

手动控制分页时，如果知道总行数，可以向表格提供 rowCount 值。pageCount 将根据 rowCount 和 pageSize 内部计算。

autoResetPageIndex

tsx

autoResetPageIndex?: boolean

autoResetPageIndex?: boolean

如果设置为 true，当影响分页的状态更改时（例如更新 data、更改筛选器、更改分组等），分页将重置到第一页。

🧠 注意：如果 manualPagination 设置为 true，则此选项默认为 false。

onPaginationChange

tsx

onPaginationChange?: OnChangeFn<PaginationState>

onPaginationChange?: OnChangeFn<PaginationState>

如果提供了此函数，则在分页状态更改时将调用该函数，并且您需要自己管理状态。您可以通过 tableOptions.state.pagination 选项将管理的状态传递回表格。

getPaginationRowModel

tsx

getPaginationRowModel?: (table: Table<TData>) => () => RowModel<TData>

getPaginationRowModel?: (table: Table<TData>) => () => RowModel<TData>

返回分页发生后但不再进一步的行模型。

默认情况下，分页列会自动重新排序到列列表的开头。如果您希望删除它们或保持原样，请在此处设置适当的模式。

表格 API

setPagination

tsx

setPagination: (updater: Updater<PaginationState>) => void

setPagination: (updater: Updater<PaginationState>) => void

设置或更新 state.pagination 状态。

resetPagination

tsx

resetPagination: (defaultState?: boolean) => void

resetPagination: (defaultState?: boolean) => void

将 pagination 状态重置为 initialState.pagination，或者可以传递 true 以强制将默认空白状态重置为 []。

setPageIndex

tsx

setPageIndex: (updater: Updater<number>) => void

setPageIndex: (updater: Updater<number>) => void

使用提供的函数或值更新页面索引。

resetPageIndex

tsx

resetPageIndex: (defaultState?: boolean) => void

resetPageIndex: (defaultState?: boolean) => void

将页面索引重置为其初始状态。如果 defaultState 为 true，则无论初始状态如何，页面索引都将重置为 0。

setPageSize

tsx

setPageSize: (updater: Updater<number>) => void

setPageSize: (updater: Updater<number>) => void

使用提供的函数或值更新页面大小。

resetPageSize

tsx

resetPageSize: (defaultState?: boolean) => void

resetPageSize: (defaultState?: boolean) => void

将页面大小重置为其初始状态。如果 defaultState 为 true，则无论初始状态如何，页面大小都将重置为 10。

getPageOptions

tsx

getPageOptions: () => number[]

getPageOptions: () => number[]

返回当前页面大小的页面选项数组（从零开始索引）。

getCanPreviousPage

tsx

getCanPreviousPage: () => boolean

getCanPreviousPage: () => boolean

返回表格是否可以转到上一页。

getCanNextPage

tsx

getCanNextPage: () => boolean

getCanNextPage: () => boolean

返回表格是否可以转到下一页。

tsx

previousPage: () => void

previousPage: () => void

如果可能，将页面索引减一。

tsx

nextPage: () => void

nextPage: () => void

如果可能，将页面索引加一。

firstPage

tsx

firstPage: () => void

firstPage: () => void

将页面索引设置为 0。

lastPage

tsx

lastPage: () => void

lastPage: () => void

将页面索引设置为最后一个可用页面。

getPageCount

tsx

getPageCount: () => number

getPageCount: () => number

返回页面计数。如果手��分页或控制分页状态，这将直接来自 options.pageCount 表格选项，否则将根据总行数和当前页面大小从表格数据中计算得出。

getPrePaginationRowModel

tsx

getPrePaginationRowModel: () => RowModel<TData>

getPrePaginationRowModel: () => RowModel<TData>

返回应用任何分页之前的表格行模型。

getPaginationRowModel

tsx

getPaginationRowModel: () => RowModel<TData>

getPaginationRowModel: () => RowModel<TData>

返回应用分页之后的表格行模型。