reactjs - 如何向 Material-UI dataGrid/XGrid 中的过滤器添加下拉列表或复选框

Question

我正在尝试向其中一个列过滤器添加一个复选框或下拉列表。我已经尝试在列中使用 type="boolean" ，它正在创建下拉列表，但没有像我期望的那样创建列表。我期待下拉菜单有两个选项，如“Reachable”和“Unreachable”，但它正在创建“true”或“false”。

他们是否有任何道具名称来创建过滤器类型的名称？我期待这样

或者

但我越来越像这样

我的代码看起来像这样

let rows = list.map((obj, index) => {
  return (rows = {
    id: index,
    "Device ID": obj.device_ID,
    Status: obj.device_status,
    "Last Reading": obj.device_time
  });
});

const columns = [
  {
    field: "Device ID",
    flex: 1,
    renderHeader: () => <FormattedMessage id={"device.param.deviceMrid"} />
  },
  {
    field: "Status",
    flex: 1,
    type: "boolean",
    renderHeader: () => <FormattedMessage id={"history.param.deviceStatus"} />
  },
  {
    field: "Last Reading",
    flex: 1,
    type: "dateTime",
    renderHeader: () => (
      <FormattedMessage id={"history.param.deviceStatusDate"} />
    )
  }
];

<div style={{ height: "90%", width: "100%" }}>
  <XGrid
    pageSize={50}
    rowsPerPageOptions={[25, 50, 100]}
    rows={rows}
    columns={columns}
    pagination={true}
  />
</div>;

谢谢！！

标签： reactjsdatagridmaterial-uixgrid