英文:
Maintain Column Filter State using Materal React Table
问题
我正在使用Material React Table来显示记录列表。在初始化组件时，如何保持筛选状态？（例如，用户导航离开并返回等情况）
在我的列中，我有多选和文本字段变体的筛选。
const columns = useMemo(
() => [
{
accessorKey: 'description',
header: 'Description',
filterVariant: 'text',
size: 150,
},
{
accessorKey: 'task_type',
header: 'Type',
size: 90,
filterVariant: 'multi-select',
}
],
[]
)
这是我的表格。
<MaterialReactTable
columns={columns}
data={rows}
enableStickyHeader
enablePinning
initialState={{ density: 'compact' }}
enableFacetedValues
enableFilterMatchHighlighting
muiTablePaperProps={{
elevation: 0,
sx: {
borderRadius: '0'
}
}}
muiTableContainerProps={{ sx: { maxHeight: '350px' } }}
/>
英文:
I am using Material React Table to display the list of records. How can I maintain the filter state while initializing the component? (In case the user navigates away and comes back etc.)
In my column, I have a multi-select and text field variant filter.
const columns = useMemo(
() => [
{
accessorKey: 'description',
header: 'Description',
filterVariant: 'text',
size: 150,
},
{
accessorKey: 'task_type',
header: 'Type',
size: 90,
filterVariant: 'multi-select',
}
],
[]
)
This is my Table.
<MaterialReactTable
columns={columns}
data={rows}
enableStickyHeader
enablePinning
initialState={{ density: 'compact' }}
enableFacetedValues
enableFilterMatchHighlighting
muiTablePaperProps={{
elevation: 0,
sx: {
borderRadius: '0'
}
}}
muiTableContainerProps={{ sx: { maxHeight: '350px' } }}
/>
答案1
得分: 0
如果我的假设是正确的，那么您需要在用户选择一个过滤器并导航到另一页，然后返回页面时不更改过滤器。
您可以使用自定义函数来实现这一点。请参阅此文档Material Table Custom Filter Function。
英文:
If my assumption is correct you need the filter to not been changed if the user select a filter and navigates to another page and reverts back to the page
you can use a custom function for this. See this documentation Material Table Custom Filter Function
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论