JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://dev.sencha.com/extjs/5.0.0/ext-all-debug.js"></script>
<link rel="stylesheet" href="http://dev.sencha.com/extjs/5.0.0/packages/ext-theme-crisp/build/resources/ext-theme-crisp-all-debug.css">
JavaScript
Ext.onReady(function() {
var columns = [
{
text : 'Column 1',
dataIndex: 'column1',
locked : true,
width : 200
},
{
text : 'Column 2',
dataIndex: 'column2',
width : 200
},
{
text : 'Column 3',
dataIndex: 'column3',
width : 200
}
];
var store = Ext.create('Ext.data.ArrayStore', {
fields: [
{name: 'column1'},
{name: 'column2'},
{name: 'column3'}
]
});
var grid = Ext.create('Ext.grid.Panel', {
columns: [],
enableLocking: true,
renderTo: Ext.getBody(),
width: 400,
height: 300
});
grid.reconfigure(store, columns);
grid.getStore().loadData([
[ 'Row 1 Column 1', 'Row 1 Column 2', 'Row 1 Column 3' ],
[ 'Row 2 Column 1', 'Row 2 Column 2', 'Row 2 Column 3' ]
]);
});