如何清除反应表中的所有过滤器答案

【问题标题】：How to clear all filters in react-table如何清除反应表中的所有过滤器
【发布时间】：2020-06-02 10:06:17
【问题描述】：

我正在使用 react-table v7 (https://www.npmjs.com/package/react-table) 。我能够过滤数据（引用自 https://codesandbox.io/s/github/tannerlinsley/react-table/tree/master/examples/filtering ）并且我正在对所有要过滤的列使用 SelectColumnFilter 函数。我想创建一个按钮来重置所有过滤器。就像如果我通过单击“全部重置”按钮将过滤器应用于 4 列，我希望清除所有过滤器。有人可以帮我吗？谢谢你

【问题讨论】：

标签： reactjs react-table

【解决方案1】：

你可以从useTable实例中获取setAllFilters方法，然后

const { ...setAllFilters } = useTable({ columns, data }, userFilters)

// somewhere at you code
<button onClick={() => setAllFilters([])}>Reset</button>

在https://github.com/tannerlinsley/react-table/blob/master/docs/api/useFilters.md检查 setAllFilters

【讨论】：

嘿@goldenbearkin，谢谢你的回答。它确实重置了表格，但过滤后的值（通过 SelectColumnFilter 过滤）没有清除。你能帮我清除那些吗？？？
@blessyjulie，你能在codesandbox中举个例子吗？
codesandbox.io/s/… 如果您将 First Name 从 All -> 过滤为任何特定值，并且当您选择 RESET BUTTON 时，表格将重置，但过滤器中的值我们从 All-> 转换为任何特定值都保持原样。你也能帮我清除吗？？？
这个怎么样？ codesandbox.io/s/blissful-shtern-ijc5o我使值={filterValue || "All"}（见第 76 行）。