Ag Grid 自定义（选定）行样式

Question

我正在尝试将自定义样式添加到我的 AgGrid 中的每一行。 我在 onGridReady:

中使用了以下代码片段

gridOptions.getRowStyle = function (params) {
  if (params.node.rowIndex % 2 === 0) {
    return { background: "#f0f1f4" };
};

我遇到的问题是我想添加一个变体来指示该行是否被选中。目前，无论哪种方式，风格都保持不变。 我应该在我的代码中添加什么来实现这一点？

提前感谢您的阅读和回复。

Answer 1

A​​gGrid 公开每个行元素的多个 class 名称来描述其当前状态（ag-row、ag-row-odd、ag-row-selected...）。如果当前选择的行样式如下所示，您可以利用该信息来覆盖行样式：

.ag-theme-alpine .ag-row.ag-row-odd {
  background-color: pink;
}
.ag-theme-alpine .ag-row.ag-row-odd.ag-row-selected {
  background-color: red;
}

Live Demo