extjs render 用法介紹_extjs

複製程式碼 程式碼如下:

var cm = new Ext.grid.ColumnModel(
[
new Ext.grid.RowNumberer({ header: "", width: 20, align: 'center' }),
{ header: '', align: 'center', dataIndex: 'AccountAndRoseID', width: 50, sortable: true, hidden: true },
{ header: '', align: 'center', dataIndex: 'UserAccountId', width: 50, sortable: true, hidden: true },
{ header : '帳號', align: 'center', dataIndex: 'UserAccountName', width: 200, sortable: true },
{ header: '角色名稱', align: 'center', dataIndex: 'UserRoleName', width : 200, sortable: true },
{ header: '狀態', align: 'center', dataIndex: 'UserAccountStateId', width: 200, sortable: true, hidden: true, renderer: function() }
]

renderer可以格式化該列顯示的資料格式或按照你自訂的腳本顯示最終資料樣子（我目前是這麼理解的）
先看下renderer: function( )裡的參數

複製程式碼 程式碼如下:

renderer:function(function,function( record, rowIndex, columnIndex, store){

}

1.value是目前單元格的值
2.cellmeta裡面保存的是cellId單元格id，id不知道是乾啥的，似乎是列號，css是這個單元格的css樣式。
3.record是這行的所有數據，你想要什麼，record.data["id"]這樣就獲得了。
4.rowIndex是行號，不是從頭往下數的意思，而是計算了分頁以後的結果。
5.columnIndex列號太簡單了。
6.store，這個厲害，實際上這個是你構造表格時候傳遞的ds，也就是說表格裡所有的數據，你都可以隨便調用，唉，太厲害了。

網路上找到一篇博文，非常不錯，直觀明了：

複製程式碼 程式碼

複製程式碼 程式碼