KendoReact Grid Loading Indicator
The Grid has a built in KendoReact Loader component that displays a loading indicator over the grid's content while data is being fetched. This feature helps users understand that data is still being processed rather than assuming the grid is empty or unresponsive.
Built-in Loading Indicator
To enable the built-in loading overlay, set the showLoader of the Grid to true.
The following example demonstrates how the built-in loader functions when data is being loaded:
Custom Loading Indicator
For more flexibility, the KendoReact Grid also allows you to replace the default loader with a fully customizable loading indicator. This is particularly useful if you want to match the loading state with your application's design language or provide additional context while data is being retrieved.
To use a custom loading indicator, pass your custom component to the loader prop.
You can see a sample implementation of a custom loading indicator for the Grid in the Demo below.