Footer Template

Updated on Aug 14, 2026

The Kendo UI for Vue Native Grid enables you to customize the rendering of its footer cells with the cells prop.

To implement a custom footer cell:

1. Set cells on the Grid to customize footer cells in all columns.
2. Set cells on a column to customize the footer cell in that column.

Set footerCell in cells to a named slot or a Vue component. The Grid renders a footer row when a column or the Grid defines a footer cell. For the available footer-cell properties, see the GridCustomFooterCellProps API.

The following example uses a named slot to customize the footer cell in the UnitPrice column.

Loading ...

For applications on earlier Grid versions that still use footerCell, see Use Legacy Grid Templates.

Suggested Links

• API Reference of the Grid
• API Index of the Grid
• Add Multi-row Footer to the Grid