The DataView component has a function similar to the grid—showing data in a formatted way—but it can be lighter or heavier, depending on how it's handled. When we say "formatted way", we mean that we use a template to render an HTML output for each record in the store.
For the rendering process, the DataView uses an Ext.XTemplate class, so we can give the proper output (HTML) and style to each record in the store. This component is very useful when you want to render data in a customized way and also don't require the functionality of the grid.
In this chapter, you'll learn how the Ext.view.View class (DataView) and the Ext.XTemplate class work together.
The topics we are going to cover in this chapter are as follows:
The data connection (models and stores)
A basic DataView
Handling events in DataView
Templates
A more complex DataView component