npm install @eduenano27/react-datatable
autoRefresh | number | Seconds to refresh table data | disabled |
showLimit | boolean | Show row limit | false |
showSearch | boolean | Show search box | false |
showPagination | boolean | Show pagination | true |
src | string | API Endpoint | null |
className | string | Table container class name | null |
columns | ITableColumn\caption | any | Column header |
captionClass | string | Column header class |
row | (props: ITableRow\cellClass | (props: ITableRow\row | \flush | () => void | Force refresh API data |
flush: You have to replace this on table column row: ColumnComponent, by row: row => ,
jsx
import React from "react";
import DataTable from "@eduenano27/react-datatable";
interface IFakeUser {
id: number,
name: string,
email: string
}
export default function TableComponent() {
return (
showLimit
showSearch
src='/api/players'
header={ ({ limit, search, flush }) => Header }
columns={ [
{
caption: 'ID',
captionClass: 'text-center',
row: ({ row }) => row.id,
cellClass: ({ row }) => 'text-center'
},
{
caption: 'Nombre',
captionClass: 'text-center',
row: ({ row }) => row.name,
cellClass: ({ row }) => 'text-center'
},
{
caption: 'Opciones',
row: ({ row, flush }) => {
return (
);
}
}
] }/>
);
}
``