由于AG-Grid React 23版本开始,它的样式表在编译时处理成CSS变量,再通过JavaScript应用它们到网格上,这种处理会覆盖掉所有自定义的CSS。解决这个问题的方法是在配置中设定headerHeight和rowHeight属性,以此覆盖原生CSS变量。例如:
const gridOptions = {
headerHeight: 60,
rowHeight: 40,
...
};
这样,AG-Grid将使用你指定的值来更新变量。
同时,还可以利用CSS选择器来修改样式:
.ag-cell {
font-size: 16px !important;
}
这样,你就可以通过CSS来修改网格的样式。