Material UI - DataGrid 自定义列表过滤器

【问题标题】：Material UI - DataGrid custom list filterMaterial UI - DataGrid 自定义列表过滤器
【发布时间】：2021-04-19 08:37:43
【问题描述】：

我在 Material UI DataGrid 上尝试了一些自定义过滤器，例如https://material-ui.com/components/data-grid/filtering/

但我看不到制作包含要过滤的文本的列表的可能性。所以一行包含“开始”、“停止”和“未定义”作为值。如何直接过滤它们而无需一直输入文本？（类似于预定义值的列表）

提前谢谢你。

【问题讨论】：

【解决方案1】：

您必须实现自己的FilterPanel，通过components 属性将其传递给数据网格。 components prop exposes overridable components 在数据网格内。你可以这样使用它：

<DataGrid
  {...data}
  components={{
    FilterPanel: YourFilterPanel
  }}
/>

您还可以通过componentProps 以相同的方式覆盖传递给这些被覆盖组件的道具。

【讨论】：