基于列体模板的Primereact DataTable过滤

Question

有没有办法配置 primereact 数据表全局过滤器，使其根据单元格主体（模板化）中显示的内容而不是原始值进行过滤？

例如，我有这些专栏：

<Column
  field="date"
  header="Date"
  body={(row) => moment(row.date).format("DD/MM/YYYY hh:mm:ss A")}
/>

<Column
  field="completed"
  header="Completed"
  body={(row) => row.completed === "Y" ? "Completed" : "Not Completed"}
/>

row.date 和 row.completed 是日期和字符串类型，我想将其显示为某种格式。

我只想要一个全局过滤器，所以我将其设置并作为道具传递到 DataTable，如下所示：

  const [filters, setFilters] = useState({
    global: {
      value: null,
      matchMode: FilterMatchMode.CONTAINS,
    },
  });
 
  ... 

  <DataTable
    filters={filters}
    globalFilterFields={myFields}
    ...
  >

  {myColumns}

  </DataTable>
  ...

全局过滤工作正常，但对于使用上面显示的日期和已完成列等模板的列，全局过滤器将仅根据原始值进行过滤。

因此，如果我在已完成的列中输入“Y”而不是“Completed”，则行将被匹配，并且它只会匹配 Date 对象的字符串表示形式，如“Thu Feb 08 2024 ...”，但不会匹配“2024 年 8 月 2 日”。

我无法将数据传递到预先格式化的数据表，因为它会弄乱排序，就像日期一样，然后将其作为字符串进行比较。我也知道 filterFunction Column 属性，但在文档中没有很好地解释它，并且我认为在使用全局过滤器时没有使用它，因为当我尝试它时我的日志没有触发。

我有什么方法可以根据模板值过滤这些列，或者可能有不同的方法来解决这个问题？

Answer 1

就我而言，我使用字符串值创建了一个新列，然后您可以搜索全局过滤器