如何自定义React AG-Grid单元格的选择轮廓？

Question

在 AG-Grid 中，默认情况下，通过单击选择一个单元格会显示蓝色轮廓：

但是，我通过修改

cellStyle

的

defaultColDef

属性为所有单元格添加了边框：

cellStyle: (params) => {
    return {
        border: '1px solid #cccaca',
    }
},

单元格最终看起来像这样，但单击它们不会显示蓝色轮廓（我猜它被边框隐藏了）：

有没有办法自定义单元格以同时具有边框和选择轮廓？

Answer 1

使用这个类

.ag-cell-focus {
  border: 1px solid red !important;
}

这样做，您聚焦的单元格将带有红色边框。

游乐场：https://plnkr.co/edit/jicOlLIWOldJPMhD?preview（寻找年龄栏）

更新

在外部单击时清除边框

.ag-has-focus .ag-cell-focus {
  border: 1px solid red !important;
}