JSFiddle - React, Tailwind, and code Playground

by chaoszcat

HTML

<link rel="stylesheet" href="http://dev.sencha.com/deploy/touch/resources/css/sencha-touch.css">
<script src="http://dev.sencha.com/deploy/touch/sencha-touch.js"></script>

JavaScript

function getListView(tab_index) {

    return (new Ext.List({
        store: new Ext.data.Store({
            fields: ['id', 'name'],
            data: (function() {
                var d = [],
                    i = 0;
                
                for (; i < 10; i++) {
                    d.push({
                        id: i, name: i*(tab_index+1)
                    });
                }
                return d;
            })()
        }),
        itemTpl: new Ext.XTemplate(
            '<tpl for=".">',
              '<div class="my_row">',
              '  {name}',
              '</div>',
            '</tpl>'
        ),
        onItemDisclosure: true,
        listeners : {
          itemtap : function(dv,index,item,e){
              var rec = dv.getRecord(item);
              console.log(rec.data.name);
          }
        }
    }));
}

MyView = Ext.extend(Ext.TabPanel, {
    renderTo: Ext.getBody(),
    fullscreen: true,
    items: [
        {
            title: 'title 1',
            xtype: 'panel',
            scroll: 'vertical',
            items: getListView(0)
        },
        {
            title: 'title 2',
            xtype: 'panel',
            scroll: 'vertical',
            items: getListView(1)
        }
    ]
});

Ext.setup({
    onReady: function() {
        new MyView();
    }
});