如何使用React JS过滤HTML表格的所有列？

Question

我正在创建自定义数据表。我添加了排序，分页，但是无法在所有列上进行搜索。这是我创建的内容的网址

https://codesandbox.io/s/yv48o7onwj

数据数组包含大写单词和整数。

如何使用单个输入框对所有列实施过滤/搜索？

Answer 1

您可以使用Array.filter

const filtered = products.filter(item => (
   item.id === searchString ||
   item.name === searchString ||
   item.price === searchString ||
   item.qa === searchString ||
   item.qr === searchString ||
   item.vendor === searchString
));

，然后将第326行的{products.map(item => {替换为{filtered.map(item => {