javascript - 更改每隔一行的背景颜色

标签 javascript css ag-grid

我正在尝试复制 ag-grid 的默认设置,该设置将每隔一行背景绘制成稍微不同的颜色。但是,当我尝试单击 headerColumn 重新排序列时,背景颜色不会重新排序。

这是我目前不起作用的方法

cellStyle(params) {
  let backgroundColor = #FFFFFF;
  if (params.node.rowIndex % 2 === 1) backgroundColor = #E04F00;
}

https://plnkr.co/edit/bHLEmECLNby3obIT ,此示例显示了所需的行为。

有没有办法访问和更改这些默认颜色?

最佳答案

我发现 ag-grid 的默认主题已经做了我想要的,问题是我使用的主题有两种非常相似的颜色,我真正需要的是更改默认颜色。

我能够通过覆盖主题的变量来实现这一点

.ag-theme-balham {
  --ag-odd-row-background-color: #E04F00;
}
.ag-theme-balham .ag-row-odd {
  background-color: var(--ag-odd-row-background-color);
}

我遵循了他们的文档,首先在这里 https://www.ag-grid.com/javascript-grid-styling/ ,这把我带到了https://github.com/ag-grid/ag-grid-customise-theme ,在那里我发现了我应该编辑哪个变量。

关于javascript - 更改每隔一行的背景颜色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/62330171/

相关文章:

javascript - 为什么内部 Javascript 循环会阻止外部循环中断(即无限循环)?

CSS:在容器上禁用选择,在子容器上启用(在 Firefox 中不起作用)

css - 我希望我的文本流到下一行,但 Flex 不允许我这样做?

iphone - UIWebView 根据所选主题更改 css 文件

angular - ag-grid 和 angular,如何动态切换网格选项

Ag-grid:计算每个过滤器选择的行数

javascript - 在 Python 中复制 Javascript 按位运算

javascript - 将类实例添加到集合的最佳方法

javascript - 如果第一次未完成,则防止第二次启动功能

ag-grid - 添加具有无限行模型的行