React Material Table - 数据未正确过滤

Question

我在我的 React 项目中使用 Material Table。一切都呈现得很好，但过滤和搜索不正常。我在这里创建了示例代码：

https://codesandbox.io/s/confident-franklin-hkxet?file=/src/Table.jsx

问题是无论我在搜索栏或自定义列过滤器中键入什么，它都会给出 0 个结果。即使是一个字母也足以使返回结果为 0.

可能导致问题的原因是什么？是我在每一列中呈现数据的方式吗？如果是，我该如何解决？

Answer 1

这是因为您在行数据中使用了嵌套属性，就像您在 render 属性中自定义显示文本的方式一样，您也需要覆盖 customFilterAndSearch，如果您希望过滤器正常运行：

{
  title: "League",
  field: "League",
  render: (rowData) => rowData.league.name,
  customFilterAndSearch: (term, rowData) =>
    rowData.league.name.toLowerCase().indexOf(term.toLowerCase()) > -1
},

参考：Custom Filtering Algorithm Example

React Material Table - 数据未正确过滤

React Material Table - data is not filtered correctly

javascript

reactjs

material-design

material-ui

material-table

现场演示