Cell

The cell object represent a single cell in a table.

API Options

`id`

id: string

id: string

The unique ID for the cell across the entire table.

`getValue`

getValue: () => any

getValue: () => any

Returns the value for the cell, accessed via the associated column's accessor key or accessor function.

`row`

row: Row<TData>

row: Row<TData>

The associated Row object for the cell.

`column`

column: Column<TData>

column: Column<TData>

The associated Column object for the cell.

`getContext`

getContext: () => {
  table: Table<TData>
  column: Column<TData, TValue>
  row: Row<TData>
  cell: Cell<TData, TValue>
  getValue: <TTValue = TValue,>() => TTValue
  renderValue: <TTValue = TValue,>() => TTValue | null
}

getContext: () => {
  table: Table<TData>
  column: Column<TData, TValue>
  row: Row<TData>
  cell: Cell<TData, TValue>
  getValue: <TTValue = TValue,>() => TTValue
  renderValue: <TTValue = TValue,>() => TTValue | null
}

Returns the rendering context (or props) for cell-based components like cells and aggregated cells. Use these props with your framework's flexRender utility to render these using the template of your choice:

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

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

Credits

Cell - TanStack Table v8 Docs

Row Column Ordering