Haf*_*lal 6 javascript arrays reactjs react-table react-table-v7
如何根据日期范围过滤表格数据?
在此处将过滤器设置为日期列:
const tableInstance = useRef(null);
const filterTable = (dates) => {
if (tableInstance.current) {
tableInstance.current.setFilter('session_date', dates);
}
};
Run Code Online (Sandbox Code Playgroud)
onClick 功能在这里:
const handleFilter = () => {
setSessionsData(data);
if (sessionsData) {
const dateArray = getDates(
moment(fromDate).format('L'),
moment(toDate).format('L')
);
filterTable(dateArray);
}
};
Run Code Online (Sandbox Code Playgroud)
小智 3
将此过滤器添加到您各自的列对象中
{
id: 'your_column_id',
accessor: 'your_accessor',
filter: (rows, id, filterValue) => {
return rows.filter(
(row) =>
filterValue.length <= 0 ||
!filterValue ||
filterValue.includes(row.values[id])
);
}
}
Run Code Online (Sandbox Code Playgroud)
这里的filterValue包含包含所有可能的匹配的数组,即您的情况下的dateArray(从'fromDate'到'toDate'的所有日期)。
| 归档时间: |
|
| 查看次数: |
807 次 |
| 最近记录: |