如何更改Material ui DataGrid中的行背景颜色？

Question

我使用了 Material ui 数据网格来显示一些数据。

import { DataGrid } from "@material-ui/data-grid"const 

columns = [
{
  id: "...",
  name: "...",      
},
...]
const rows = .....
<DataGrid rows={rows} columns={columns} autoHeight={true} />

现在我想根据行的“名称”属性更改行颜色。我的意思是我想为具有不同名称的每一行设置不同的颜色。我该怎么做？

Answer 1

MUI 有一个用于设置行样式的示例，可以在此处找到： https: //mui.com/x/react-data-grid/style/#styling-rows

您将需要使用该getRowClassNameprop 并为其提供一个函数，该函数具有您想要生成所需样式的类的任何逻辑。