The KendoReact TreeList provides options for customizing its cell content by allowing you to define different types of cells.
TreeListCell component represents a React component that accepts
TreeListCellProps and returns a
<td /> element. The TreeList initializes its cells by using the values from the corresponding data item for each of its rows and columns. You can replace a cell with a custom cell by using the
cell property of the column.
TreeListBooleanFilter represent React components. The TreeList renders a single filter cell for each column inside the filter row. The filter cells take their values from the value of the
filter property. You can replace a filter cell with a custom cell by using the
filterCell property of the column.
TreeListBooleanEditor components represent React components that accept
TreeListCellProps. The TreeList renders a single edit cell for each column where a data item is in edit mode. Each edit cell triggers the
TreeListItemChangeEvent event and takes its value from the corresponding data item. You can replace an edit cell with a custom cell by using the
editCell property of the column.
TreeListHeaderCell component represents a React component that accepts
TreeListHeaderCellProps. The TreeList renders a single header cell for the header of each column. Each header cell displays the data
field or the
title property together with the sorting indicators. You can replace a header cell with a custom cell by using the
headerCell property of the column.
The following example demonstrates how to set a custom cell in the TreeList.