css - AgGrid：用于调整列大小的自定义调整大小图标

Question

有没有办法添加自定义调整大小图标？我在文档中没有找到任何合适的解决方案。我尝试添加自定义 CSS 规则ag-header-cell-resize但没有任何成功。

标签： cssag-gridag-grid-react

Answer 1

那只是一个div带有灰色背景色的元素，而不是一个图标。您可以使用 css 对其进行自定义。下面的示例将调整大小的 div 颜色更改为red并增加其大小：

.ag-header-container .ag-header-cell-resize {
  width: 15px;
}
.ag-header-container .ag-header-cell .ag-header-cell-resize::after {
  background-color: red;
  height: 100%;
  top: 0;
  width: 100%;
}

现场演示

https://plnkr.co/edit/V7rbCuvYCVjkJIOb