Sencha Touch - Vista de datos

Descripción

Esto es para crear múltiples vistas de forma dinámica en función de los valores de la tienda. Usamos la vista de datos básicamente cuando queremos mostrar el mismo componente varias veces.

Sintaxis

A continuación se muestra la sintaxis simple para crear una vista de datos.

Ext.create('Ext.DataView', {})

Ejemplo

A continuación se muestra un ejemplo sencillo que muestra el uso.

<!DOCTYPE html>
<html>
   <head>
      <link href = "https://cdn.sencha.com/touch/sencha-touch-2.4.2/resources/css/sencha-touch.css" rel = "stylesheet" />
      <script type = "text/javascript" src = "https://cdn.sencha.com/touch/sencha-touch-2.4.2/sencha-touch-all.js">
      </script>
      <script type = "text/javascript">
         Ext.application({
            name: 'Sencha',
            launch: function() {
               var touchTeam = Ext.create('Ext.DataView', {
                  fullscreen: true,

                  store: {
                     fields: ['name', 'age'],
                     data: [
                        {name: 'Greg',  age: 100},
                        {name: 'Brandon',   age: 21},
                        {name: 'Scott',   age: 21},
                        {name: 'Gary', age: 24},
                        {name: 'Fred', age: 24},
                        {name: 'Seth',   age: 26},
                        {name: 'Kevin',   age: 26},
                        {name: 'Israel',   age: 26},
                        {name: 'Mitch', age: 26}
                     ]
                  },

                  itemTpl: '{name} is {age} years old'
               });
            }
         }); 
      </script>
   </head>
   <body>
   </body>
</html>

Esto producirá el siguiente resultado: