Creative Tim  |  Docs

Table

The Table component helps you to simply create a beautiful table for your data.

The below codes are editable and you can modify them the way you want directly from your browser, please use the green button or the ctrl + s to save the changes.

Demo

// Soft UI Dashboard React examples import Table from "examples/Tables/Table"; // Soft UI Dashboard React components import SuiBox from "components/SuiBox"; // Soft UI Dashboard PRO React components import SuiBadgeDot from "components/SuiBadgeDot";
NAMEFUNCTIONREVIEWEMAILEMPLOYED
John Micheal
Manager
positive
[email protected]23/04/18
Alexa Liras
Programator
positive
[email protected]11/01/19
Laurent Perrier
Executive
neutral
[email protected]19/09/17
Michael Levi
Backend Developer
positive
[email protected]24/12/08
Richard Gran
Manager
negative
[email protected]04/10/21
Miriam Eric
Programtor
positive
[email protected]14/09/20

Props Information

NameTypeDefaultDescription
columnsarray[]Used to set the table columns.
rowsarray[{}]Used to set the table rows.

It should be mentioned that if you want to display an image in a column you should define the column data in an array that contains the image and data of the column, the first element of the array should be the image and the second element of the array should be the data.

You can also pass nodes for the keys insides the objects of the rows prop.

Contents