Skip to main content


To define the columns of the table

  • optional (you can render a table without the header)
  • Type: string[] or TColumn[]
new Grid({
columns: ["Name", "Email", "Phone Number"]


new Grid({
columns: [{
name: "Name",
sort: true,
}, {
name: "Email"
}, {
name: "Phone Number",
width: '50%'

TColumn type has the following properties:

id optionalcolumn IDstringphoneNumber
data optionalCell default datafunction or TCell(row) => or myData
namecolumn namestringName
width optionalwidth of the columnstring200px or 30%
sort optionalto enable/disable sortbooleantrue or 0
hidden optionalto show/hide the columnbooleantrue or 0
formatter optionalcustom cell formattingfunction(cell: TCell, row: Row<TCell>, column: TColumn) => ComponentChild;
attributes optionalcustom cell attributesHTMLAttributes or function(cell: TCell, row: Row<TCell>, column: TColumn) => HTMLAttributes;

See Cell formatting example for more details.