JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://cdn.sencha.io/touch/sencha-touch-2.2.1/sencha-touch-all.js"></script>
<link rel="stylesheet" href="http://cdn.sencha.io/touch/sencha-touch-2.2.1/resources/css/sencha-touch.css">

JavaScript

Ext.Loader.setConfig({
    enabled: true
});

Ext.application({
    launch: function () {
        Ext.create('Ext.DataView', {
            fullscreen: true,
            scrollable: {
                direction:'vertical',
                scroller: {
                    listeners:{
                        scroll:function(){
                            console.log('[scrollable][on scroll]');
                        },
                        scrollend:function( scroller, x, y, eOpts ){
                            console.log('[scrollable][on scrollend]x='+x+', y='+y);
                        }
                    }
                }
            },
            store: {
                fields: ['name', 'age'],
                data: [
                    {name: 'Jamie',  age: 100},
                    {name: 'Rob',   age: 21},
                    {name: 'Tommy', age: 24},
                    {name: 'Jacky', age: 24},
                    {name: 'Ed',   age: 26}
                ]
            },

            itemTpl: '<div>{name} is {age} years old</div>'
        });
    }
});