Extjs 自定义 TreeGrid 行 CSS

Question

有没有办法在树网格的子级别上应用替代行 css？

目前treePanel viewConfig 上的stripeRows 配置只是使所有内容变成灰色和白色，但是很难区分子行和父行。

理想情况下，我想让父对象以一种方式交替颜色，而子行以另一种方式交替颜色。

我正在考虑使用“getRowClass”方法编写一个函数来手动更新行类。我想知道是否有更清洁的方法。

Answer 1

getRowClass 看起来很适合执行行属性更改。您可以使用 getDepth() 函数获取节点的深度:

var grid = Ext.create ('Ext.tree.Panel', {
    xtype: 'tree-grid',
    viewConfig: {
        getRowClass: function(record, rowIndex, rowParams, store) {
            return 'node-depth-' + record.getDepth()
        }
    }
...

并使用 css:

.node-dept-1 .x-grid-cell { 
    background-color: white; 
}
.node-depth-2 .x-grid-cell { 
    background-color: #dddddd;
}
...

找到解决方案 here