Default

API Reference

In its most simple usage the DataGrid component can be used to render typed collections:

Which by default will display all public serializable properties:

Simple Customizations

Which columns are displayed and how they're formatted is customizable using <Column> definitions:

Responsive

A more advanced example showing how to implement a responsive datagrid defining what columns and Headers are visible at different responsive breakpoints and using <Template> to render a custom cell:

Table Styles

Behavior of the DataGrid can be customized with the HeaderSelected event to handle when column headers are selected to apply custom filtering to the Items data source whilst the RowSelected event can be used to apply custom behavior when a row is selected.

The appearance of DataGrids can use TableStyles to change to different Tailwind Table Styles with the TableStyle Enum Flags, e.g:

Default (Striped Rows)

Simple

Uppercase Headings

Vertical Lines

White Background

Full Width

Full Width, Uppercase with Vertical Lines