When making an asynchronous data call to populate a data grid, it’s nice to be able to display something while the data is being retrieved.
The following sample code will display a simple “Loading…” message:
Here’s the LoadingScreen component:
All you need to do is set the loadingData property to true when you make the data call, and set it back to false after the data has been retrieved. In this example, the column headers are always displayed, so the transition is subtle.
For a smoother transition, you can also add a Fade effect to the LoadingScreen component.