Question

如何在extjs 5网格中实现替代行颜色。据我所知，我们必须在css中应用x-grid-row-alt类来实现这一目标。它在extjs 4中工作但在Extjs 5中工作。对此有什么看法吗？

Answer 1

您可以使用stripeRows（在网格的viewConfig设置它）：

为条带排列为真。

这会导致将CSS类x-grid-row-alt添加到备用行   的网格。提供了一个默认的CSS规则来设置背景   颜色，但您可以使用覆盖的规则覆盖此颜色   使用！important修饰符的背景颜色样式，或者哪个   使用更高特异性的CSS选择器。

如果您想要自定义，请尝试使用x-grid-item-alt代替（默认为altRowCls）。

您还可以更改scss背景颜色变量$grid-row-cell-alt-background-color。

Answer 2

在网格的getRowClass中使用viewConfig方法。

viewConfig: {
  getRowClass: function(record, index, rowParams)
  {
     return (index % 2 == 0) ? 'grid-row1' : 'grid-row2';
  }
},

CSS

tr.grid-row1 td{
    background-color: #d6f0f9;
}
tr.grid-row2 td{
    background-color: #F2F2F2;
}