如何按大于材料表中的日期过滤？

Question

赏金将在 7 天后到期。 此问题的答案有资格获得+50声望赏金。 HardRock希望引起对这个问题的更多关注。

如何在物料表中按大于当前值的日期进行过滤？

这是我到目前为止所管理的，它按确切日期过滤，我需要过滤所有 >= 表中当前值的值。

 <TableMaterial
    title=""
    columns={[  
    { title: `${t('description')}`, field: 'description' },
    {title: `${t('due_date')}`, field: 'due_date', type: 'date', align: 'center',
       filterComponent: (props) => <CustomDatePicker {...props} />}
    }]
     data={allData}
    />

这是 CustomDatePicker

const CustomDatePicker = (props) => {
  const [date, setDate] = useState(null);
  return (
    <MuiPickersUtilsProvider utils={DateFnsUtils}>
      <KeyboardDatePicker
        id="date-picker-dialog"
        format="dd/MM/yyyy"
        clearable
        value={date}
        onChange={(event) => {
          setDate(event);
          props.onFilterChanged(props.columnDef.tableData.id, event);
        }}
        KeyboardButtonProps={{
          "aria-label": "change date"
        }}
      />
    </MuiPickersUtilsProvider>
  );
};

任何帮助表示赞赏。 谢谢！

Answer 1

我设法在没有CustomDatePicker组件的情况下解决了这个问题，因为在设置字段type:date时，材料表已经内置了日期选择器。

所以只需要 function 并在材料表中调用它：

const handleDateFilter = (term,rowData) => {
        return new Date (term).setHours(0,0,0,0) <= new Date(rowData.due_date) ? true : false   
    }

 <TableMaterial
    title=""
    columns={[  
    { title: `${t('description')}`, field: 'description' },
    {title: `${t('due_date')}`, field: 'due_date', type: 'date', align: 'center',
       customFilterAndSearch: (term, rowData) => handleDateFilter(term, rowData)
    }]
     data={allData}
    />