redux 如何让Material-UI DataGrid从数组中读取对象数据?

zlhcx6iw  于 2022-11-12  发布在  其他
关注(0)|答案(3)|浏览(169)

我目前正在使用Redux从一个API获取数据。然后我使用这些数据从Material-UI填充DataGrid组件。下面是API响应的外观:x1c 0d1x
下面是我目前对列定义的设置:
第一次
DataGrid似乎能够从结果中识别id字段,如下所示,但是,我似乎无法深入到属性中以获得进一步的细节。

我正在寻找一个解决方案,将允许我显示的属性数据,沿着id。所有的帮助是感激不尽,谢谢!

mum43rcc

mum43rcc1#

您可以使用valueGetter

const columns = [
  // ...
  {
    field: 'attributeName',
    headerName: 'Attribute Name',
    valueGetter: (params) => {
      return params.getValue(params.id, "attributes").name;
    }
  },
  // ...
];

您可能还需要一个sortComparator来处理此列的排序。

igsr9ssn

igsr9ssn2#

尝试类似这样的方法来Map数据,根据需要更改名称周围的数据

const detailsRows = rows.map((row) => {
return {
  id: row.item_id,
  model: row.model_no,
  title: row.title,
};

然后像这样将其传递给DataGrid

<DataGrid rows={detailsRows} columns={props.columns} pageSize={10}/>
6l7fqoea

6l7fqoea3#

添加到Ajeet Shah's答案
getvalue在最新版本的材料UI中已过时
而不是

valueGetter: (params) => {
  return params.getValue(params.id, "attributes").name;
}

使用最新版本

valueGetter: (params) => {
  return params.row.attributes.name;
},

相关问题