在隐藏列上搜索MUI数据表

问题描述

你好,我在我的应用程序上使用mui数据表(https://github.com/gregnb/mui-datatables),当我尝试在隐藏列上搜索时遇到麻烦,下面的代码工作正常,但是当我试图搜索城市值时(列认)隐藏)它什么也不返回,同时文本显示在列(地址)上,这里有两种情况我错误地组合了列,或者我可以使用我最近的代码,但是需要一些搜索功能的调整,请让我知道如何进行此工作,谢谢。

enter image description here

解决方法

几天前,我发现自己正在解决同一问题。从3.7.1版本开始,搜索代码依赖于this conditional,这意味着不匹配隐藏或排除的列。但是,嘿,我提出了一个简单的解决方案:

如果在options对象中提供了自定义搜索功能,则将能够访问隐藏和排除列以进行匹配。当然,您需要提供能够匹配文本和对象的搜索功能。在这种情况下,我依靠super-search library

helpers/responsive.dart

在我刚刚创建的此沙箱中查看示例:

https://codesandbox.io/s/muidatatables-example-custom-search-function-0pm9o?file=/index.js

这将覆盖MUI数据表中的嵌入式搜索功能。

,

FWIW 6 个月后,我遇到了类似的事情......

示例文件夹中有一个关于如何执行此操作的示例,该示例应与“display:false,viewColumns:false”协同工作。

https://github.com/gregnb/mui-datatables/blob/master/examples/customize-search/index.js

MUIDataTable 列:

...
{
   "name":"hiddenCity","options":{
      "filter":false,"sort":false,"display":false,"viewColumns":false
   }
},{
   "name":"hiddenState",...etc...

MUIDataTable 选项:

let options = {
...lots of options...,// Search ALL columns,including hidden fields that use display:false,viewColumns:false...
            customSearch: (searchQuery,currentRow,columns) => {
                let isFound = false;
                currentRow.forEach(col => {
                  if (col && col.toString().indexOf(searchQuery) >= 0) {
                    isFound = true;
                  }
                });
                return isFound;
            },...more options...
}